Wrox Programmer Forums
|
BOOK: Beginning JavaScript and CSS Development with jQuery
This is the forum to discuss the Wrox book Beginning JavaScript and CSS Development with jQuery by Richard York; ISBN: 9780470227794
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Beginning JavaScript and CSS Development with jQuery section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old May 5th, 2011, 12:33 PM
Registered User
 
Join Date: May 2011
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default Another Example 7-1 Thread

Recently bought this book at B&N...great so far, but I also have a problem with the JSON part of Chapter 7 example 1. I tried putting double quotes around the keys and values in the .json file, but still the Fetch button does not retrieve results. Is there another solution? I tried both IE8 and Firefox.

Thanks
 
Old May 5th, 2011, 12:38 PM
richard.york's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts
Default

Can you post the relevant code, so we can see if the code looks right?
 
Old May 5th, 2011, 12:54 PM
Registered User
 
Join Date: May 2011
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Sure, here is the js (hope I am using the right code tag format)
Followed by the json file and the html. First part of the form works like it should, but the json part does not return anything.

Thanks!



Code:
$(document).ready(
  function() {
    $('input#tmpFetchName').click(
      function($e) {
        $e.preventDefault();
        $.get(
          'Example 7-1.xml',
          function(xml) {
            $('input#tmpFirstName').val($(xml).find('firstName').text());
            $('input#tmpLastName').val($(xml).find('lastName').text());
          }
        );
      }
    );

    $('input#tmpFetchOther').click(
      function($e) {
        $e.preventDefault();
        $.getJSON(
          'Example 7-1.json',
          function(json) {
            $('input#tmpTitle').val(json.title);
            $('input#tmpCompany').val(json.company);
          }
        );
      }
    );

    $('input#tmpPostData').click(
      function($e) {
        $e.preventDefault();

        var $data = $('form :input').serialize();

        $('div#tmpPostedData').html(
          "<h4>Posted Data:</h4>" +
          $data
        );

        $.post(
          'Example 7-1 Post.xml',
          $data,
          function(xml) {
            if (parseInt($(xml).text()) > 0) {
              alert('Data successfully posted!');
            }
          }
        );
      }
    );
  }
);

json file

Code:
{
  company : 'Springfield Electronics',
  title : 'Chief Widget Maker'
}
html file

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en'>
  <head>
    <meta http-equiv='content-type' content='text/html; charset=utf-8' />
    <meta http-equiv='content-language' content='en-us' />
    <title></title>
    <script type='text/javascript' 
            src='../jQuery.min.js'></script>
    <script type='text/javascript' src='Example 7-1.js'></script>
    <link type='text/css' href='Example 7-1.css' rel='stylesheet' />
  </head>
  <body>
     <form action='javascript:void(0);' method='post'>
       <fieldset>
         <legend>jQuery AJAX Recap</legend>
         <p>
           jQuery's $.get() method can be used to retrieve XML-formatted
           data, which jQuery makes incredibly easy to work with by 
           allowing you to use jQuery's rich selector API on XML documents.
         </p>
         <div>
           <label for='tmpFirstName'>First Name:</label>
           <input type='text' name='tmpFirstName' 
                  id='tmpFirstName' size='25' />
         </div>
         <div>
           <label for='tmpLastName'>Last Name:</label>
           <input type='text' name='tmpLastName' 
                  id='tmpLastName' size='25' />
         </div>
         <div class='tmpButton'>
           <input type='submit' name='tmpFetchName' 
                  id='tmpFetchName' value='Fetch Name' />
         </div>
         <p>
           jQuery also has first-class support for JSON, a data trasport
           format that is fast-rising in popularity and use.  
           JSON-formatted requests are even easier and less verbose to
           work with.
         </p>
         <div>
           <label for='tmpTitle'>Title:</label>
           <input type='text' name='tmpTitle' 
                  id='tmpTitle' size='25' />
         </div>
         <div>
           <label for='tmpCompany'>Company:</label>
           <input type='text' name='tmpCompany' 
                  id='tmpCompany' size='25' />
         </div>
         <div class='tmpButton'>
           <input type='submit' name='tmpFetchOther' 
                  id='tmpFetchOther' value='Fetch Title &amp; Company' />
         </div>
         <p>
           Finally, jQuery makes it very easy to post data back to the
           server, via its serialize() method.
         </p>
         <div class='tmpButton'>
           <input type='submit' name='tmpPostData' 
                  id='tmpPostData' value='Post Data' />
         </div>
         <div id='tmpPostedData'>
         
         </div>
       </fieldset>
     </form>
  </body>
</html>
 
Old May 5th, 2011, 01:22 PM
richard.york's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts
Default

The JSON format requires double quotes.

Code:
{
  "company" : "Springfield Electronics",
  "title" : "Chief Widget Maker"
}
 
Old May 5th, 2011, 01:45 PM
Registered User
 
Join Date: May 2011
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Quote:
Originally Posted by richard.york View Post
The JSON format requires double quotes.

Code:
{
  "company" : "Springfield Electronics",
  "title" : "Chief Widget Maker"
}
After reading the other thread about this, I tried that as well, but still had the same problem.

I also tried single quotes around all of them.

I am getting no error message, just no results in the title and company field.

Steve
 
Old May 5th, 2011, 01:53 PM
Registered User
 
Join Date: May 2011
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default json error

Quote:
Originally Posted by richard.york View Post
The JSON format requires double quotes.

Code:
{
  "company" : "Springfield Electronics",
  "title" : "Chief Widget Maker"
}
I just copied all files to my external server and it worked like it was supposed to.

The internal version that does not work was called like this:

http://marconi:8084/samples/Example 7-1.html


Do you suppose the included port could cause a problem? The internal one is using IIS as a web server (I think IIS 6). The external one that works I believe is Apache.


Steve
 
Old May 5th, 2011, 02:11 PM
Registered User
 
Join Date: May 2011
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
Default Json and IIS6

Quote:
Originally Posted by steve2k2 View Post
After reading the other thread about this, I tried that as well, but still had the same problem.

I also tried single quotes around all of them.

I am getting no error message, just no results in the title and company field.

Steve
It does appear from postings elsewhere that there is an IIS 6.0 and JSON problem - I tried some of the configuration solutions but none helped. I don't know if the post below would help (is there some sort of jquery stringify function that would work?)

http://stackoverflow.com/questions/5...working-in-iis


Steve
 
Old May 6th, 2011, 11:20 AM
richard.york's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 1,706
Thanks: 0
Thanked 6 Times in 6 Posts
Default

I've had problems calling certain files before from a web server and not explicitly encoding a space to its URL-encoded entity, i.e., %20. So that might have something to do with it.

All of the book's files were prepared and tested without a webserver so that you could download the package and get at it right away.





Similar Threads
Thread Thread Starter Forum Replies Last Post
Which Thread to use and How peace2007 ASP.NET 1.0 and 1.1 Professional 0 September 23rd, 2007 03:24 AM
a Thread argument beccali Java Basics 1 February 21st, 2007 06:12 AM
Thread was being aborted sohailmaroof ASP.NET 1.0 and 1.1 Basics 2 January 13th, 2007 02:25 AM
Timer Or Thread? (c#) kobystud C# 3 July 22nd, 2006 12:21 AM
communiation between thread gunx Pro VB 6 3 May 10th, 2005 03:56 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.