SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist
    Join Date
    Dec 2008
    Location
    Plymouth, United Kingdon
    Posts
    449
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jQuery: XML data, post(), and each()

    hi,
    this is the xml data being processed from 'comment_add_xml.php',
    Code:
    <response>
    <error>comment_email</error>
    <error>comment_content</error>
    <result>Please leave an email.</result>
    <result>Please leave a content.</result>
    </response>
    this is the jquery code supposed to post data from a html form below, it post the data from the form to 'comment_add_xml.php', then grab the xml data from it, and then display the data on the form again,
    Code JavaScript:
    this.commentAdd = function(){
    $("#result_comment").html('<div class="ajaxloader"><p><img src="img_iconies/loader_0.gif"/> loading...</p></div>');
    $.post("comment_add_xml.php",{
    	cmt_email:$('#cmt_email').val(),
    	cmt_content:$('#cmt_content').val(),
    	pg_id:$('#pg_id').val()
    	},function(xml){
    	addMessages(xml);
    });
    return false;
    }
     
    function addMessages(xml) {	
    $("error",xml).each(function(i) {
    	$("#"+$("error",xml).text()+"_label").addClass('error');
            /*
    	temp = $("error",xml).text();
    	alert(temp);
            */
    	});	
    }

    addMessages(xml) is not finished yet bcos above it should 'break' each error and result into individual elements, but instead, it joins them up together like this,

    error=> comment_emailcomment_content

    result=> Please leave an email.Please leave a content.

    Am I using the correct jquery function to process the xml data above - each()?? how can I break them into individual elements?? how can I break them into individual elements??

    this is html form,
    PHP Code:
    <form action="#" onsubmit="commentAdd(); return false;" method="post" enctype="multipart/form-data" id="form_comment">
        
        <div class="form_item">
            <label class="title" id="comment_email_label">
                <input id="cmt_email"/>&laquo; Email
            </label><img src="img_iconies/attention.png" style="visibility:hidden;" id="comment_email_img"/>
        </div>
        
        <div class="form_item">
            <label class="title" id="comment_content_label">
                <textarea id="cmt_content"></textarea>
            </label><span style="visibility:hidden;" id="comment_content_img"> </span>
        </div>
        
        <div class="form_item">
            
            <div class="form_left">
            <input type="submit" name="update" value="Submit" class="button button_submit "/>
            <input id="pg_id" name="pg_id" type="hidden" value="<?php echo $_REQUEST['pg_id'];?>" />
            </div>
            
            <div id="result_comment" class="form_right"></div>
        </div>
    </form>
    please let me know if u have any ideas.

    many thanks,
    Lau

  2. #2
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2008
    Posts
    5,757
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would structure the xml differently. Take advantage of xml's structured nature, instead of relying on the order in which the elements appear.

    Currently, you'd need to do something really ugly like this
    Code:
    function addMessages(xml) {
        var results = $("result", xml);
        var ids = $("error", xml).each(function(key, val){
            alert($(val).text() + ":" + $(results[key]).text());
        });
    }
    Because you need a way to associate which <error> element is related to which <result> element. Also, the intended structure of your current xml isn't all that clear for someone who may need to look at it later on.

    Consider
    Code:
    <response>
    <error>
      <elementid>comment_email</elementid>
      <result>Please leave an email.</result>
    </error>
    <error>
      <elementid>comment_content</elementid>
      <result>Please leave a content.</result>
    </error>
    </response>
    Or even better
    Code:
    <response>
      <error elementid="comment_email" message="Please leave an email." />
      <error elementid="comment_content" message="Please leave a content." />
    </response>
    Code:
        $("error", xml).each(function(){
            alert($(this).attr('elementid') + ":" + $(this).attr('message'));
        });

  3. #3
    SitePoint Evangelist
    Join Date
    Dec 2008
    Location
    Plymouth, United Kingdon
    Posts
    449
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you for this fantastic idea. it works perfectly in a simpler way. thanks!!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •