2

Using the code from user "wildpeaks" I tried to modify it to meet my needs, but it doesn't work. My goal is to request information returned in an xml document. Parse the xml document and post the results to the appropriate input boxes. Can anyone point out where I am going wrong.

<!DOCTYPE html> <html> <head> <title>jQuery and XML</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="language" content="en" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> </head> <body> <table> <tr><td> <select name="recordList" onChange="getRecords(this);"> <option value="1">Test1</option> <option value="2">Test2</option> <option value="3">Test3</option> </select> </td></tr> <tr><td> <input type="text" name="AnswerA192" id="AnswerA192" value=""> </td></tr> <tr><td> <input type="text" name="AnswerA189" id="AnswerA189" value=""> </td></tr> </table> <script type="text/javascript"> function getRecords(what) { $.ajax({ type: 'POST', url: 'getAutoFill.php', xhrFields: { fkAutoFill: what.value }, dataType: 'xml', success: function(xml){ $('response', xml).find('dtlFill').each(function() { $("#AnswerA" + $(this).attr("fkQuestion")).value($(this).attr("colData")); }); } }); } </script> </body> </html>

The XML file looks like

<?xml version="1.0" encoding="UTF-8"?> <dtlAutoFill> <dtlFill fkQuestion = "192" colData = "test1" colData2 = "test1"> <dtlFill fkQuestion = "189" colData = "test1" colData2 = "test1"> </dtlAutoFill>

Improve this question

3 Answers 3

Reset to default
1

The following code does what you want:

var xml = '<?xml version="1.0" encoding="UTF-8"?>' + '<dtlAutoFill>' + '<dtlFill fkQuestion = "192" colData = "test1" colData2 = "test1" />' + '<dtlFill fkQuestion = "189" colData = "test2" colData2 = "test1" />' + '</dtlAutoFill>'; $(document).ready(function() { var xmlDoc = $.parseXML(xml); var $xml = $(xmlDoc); var colData = $xml.find('dtlFill').each(function() { var colData = $(this).attr('colData'); var fkQuestion = $(this).attr('fkQuestion'); $('#AnswerA' + fkQuestion).val(colData); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" name="AnswerA192" id="AnswerA192" value=""> <input type="text" name="AnswerA189" id="AnswerA189" value="">

But I've noticed you XML is malformed, the <dtlFill> tag was not closed. jQuery will only been able to parse the XML after closing that tag.

The XML Parse snippet, was taken from the jQuery documentation.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Thank you. In order to make this perfect, I need to use Ajax to send a variable to getAutoFill.php, which dynamically generates the XML document. Once the XML document is created, parse and process it.
1

Change to:

$.ajax({ type: 'POST', url: 'getAutoFill.php', data: { fkAutoFill: what.value }, dataType: 'xml', success: function(xml) { $(xml).find('dtlFill').each(function () { $("#AnswerA" + $(this).attr("fkQuestion")).val($(this).attr("colData")); }); } });

Changes:

  1. Instead of $('response', xml), you should use just $(xml).
  2. Use the data setting instead of xhrFields.
  3. Use .val() on a jQuery object, not .value().

Note: When you specify dataType: 'xml', jQuery will automatically call $.parseXML() before passing the response object to the success callback function.

jsfiddle

Improve this answer

4 Comments

Thank you. I tried this without any luck. My issue may be with my Ajax request, is my Ajax request correct?
I also changed xhrFields to data with the same result.
@Jecker - Did you also fix the dtlFill tags so they are closed?
Yes I did. I added an / at then end, so they now read <dtlFill fkQuestion = "192" colData = "test1" colData2 = "test1" />
0

Thank you for you help. With your help I was able to make the following changes, which fixed my issue.

$.ajax({ type: 'POST', url: 'getAutoFill.php', data: { fkAutoFill: what.value }, dataType: 'html', cache: false}) .done(function(xml) { var xmlDoc = $.parseXML(xml); var $xml = $(xmlDoc); $xml.find('dtlFill').each(function() { $(".AnswerA" + $(this).attr("fkQuestion")).val($(this).attr("colData")); }); });
Improve this answer

1 Comment

@Jecker - If you use dataType: 'xml', jQuery will call $.parseXML(xml) for you before passing the value to the callback function. Also, in this case using .done() is no different than using the success callback function. So this code is equivalent to what I showed in my answer. That is, if one works, the other should work too.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.