Display XML content in HTML page to create form elements
Question
I have application in which check-box tree is present. I want to pre-populate the check-box's if user before checked some of those check box.
For that am getting XML format from my back-end perl script as shown below.like, in below XML only 0, 43,44,45,46 and 50 are coming so only those respective checkbox need to checked on page load.I want to display those checked check-box on page load by calling perl script from blackened parsing XMl .How can I do this?
<perldata>
<hashref memory_address="0x86f4880">
<item key="0">1</item>
</hashref>
</perldata>
<perldata>
<hashref memory_address="0x86f4880">
<item key="43">1</item>
</hashref>
</perldata>
<perldata>
<hashref memory_address="0x86f4880">
<item key="44">1</item>
</hashref>
</perldata>
<perldata>
<hashref memory_address="0x86f4880">
<item key="45">1</item>
</hashref>
</perldata>
<perldata>
<hashref memory_address="0x86f4880">
<item key="46">1</item>
</hashref>
</perldata>
<perldata>
<hashref memory_address="0x86f4880">
<item key="50">1</item>
</hashref>
</perldata>
2 answers
solution1
1 2012-10-20 22:12:50
Here's a demo that makes ajax request for the xml and parses the item keys as ID for checkboxes
Woring Demo: http://jsfiddle.net/592At/1/
$.get(pathToXmlFile, function(response) {
$(response).find('perldata').each(function(i) {
var itemKey = $(this).find('item').attr('key');
$('#'+itemKey).prop('checked',true)
});
})
solution2
1 ACCPTED 2012-10-22 07:49:18
I read a flat XML file , you would read from your PERL program.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(helloWorld)
function helloWorld() {
$.ajax({
url: 'perldata.xml',
success: function(data) {
$('[key]',data).each(function(){
$('#chk_'+$(this).attr('key')).prop('checked',true)
})
}
})
}
</script>
<title>perlData</title>
</head>
<body>
<div id="message">
<form>
<input id='chk_0' type='checkbox' />0<br />
<input id='chk_1' type='checkbox' />1<br />
<input id='chk_2' type='checkbox' />2<br />
<input id='chk_3' type='checkbox' />3<br />
<input id='chk_4' type='checkbox' />4<br />
<input id='chk_5' type='checkbox' />5<br />
<input id='chk_6' type='checkbox' />6<br />
<input id='chk_7' type='checkbox' />7<br />
<input id='chk_8' type='checkbox' />8<br />
<input id='chk_9' type='checkbox' />9<br />
<input id='chk_10' type='checkbox' />10<br />
<input id='chk_11' type='checkbox' />11<br />
<input id='chk_12' type='checkbox' />12<br />
<input id='chk_13' type='checkbox' />13<br />
<input id='chk_14' type='checkbox' />14<br />
<input id='chk_15' type='checkbox' />15<br />
</form>
</div>
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.