Click here to Skip to main content
15,882,768 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
JavaScript
$(document).ready(function(){
    $(document).bind('deviceready', function(){
        //Phonegap ready
        onDeviceReady();
    });
var output1 = $('#ullist');
                  
                  $.ajax({
                         url: 'http://samcroft.co.uk/demos/updated-load-data-into-phonegap/landmarks.php',
                         dataType: 'jsonp',
                         jsonp: 'jsoncallback',
                         timeout: 5000,
                         success: function(data, status){
                         $.each(data, function(i,item){

                                var landmark = <ul><li önclick="Javacsript:select(this)">'+item.name+'</li></ul>';
                                
                                function select(x)
                                {
                                    //document.write(item.name);
                                    // alert("Row index is: " + x.rowIndex);
                                    alert("This is testing");
                                
                                } 
                                output1.append(landmark);
                                
                                });
                         },
                         error: function(){
                         output.text('There was an error loading the data.');
                         }
                         });
                  });


this is my script file i am able to show the url content in the li tag and i tried onClick on it. but it didn't work.So how to select the li tag value and display in a text box in the html page.
Posted
Updated 23-Jul-13 0:49am
v4

Try using the following piece of code:

$(document).ready(function(){
    $(document).bind('deviceready', function(){
        //Phonegap ready
        onDeviceReady();
    });
var output1 = $('#ullist');
                  
function onDeviceReady() {
                  $.ajax({
                         url: 'http://samcroft.co.uk/demos/updated-load-data-into-phonegap/landmarks.php',
                         dataType: 'jsonp',
                         jsonp: 'jsoncallback',
                         timeout: 5000,
                         success: function(data, status){
                         $.each(data, function(i,item){
 
                                var landmark = '<li onclick="Javacsript:select(this);">'+item.name+'</li>';
                                output1.append(landmark);
                            });
                                
                         },
                         error: function(){
                            output.text('There was an error loading the data.');
                           }
                         });
                  });
}

function select(x)
{
    alert(item.name);                              
} 
 
Share this answer
 
Please try the following code inside success function-
JavaScript
$.each(data, function(i,item) {
 
   //create the li element
   var $landmark = $('<ul><li /></ul>').text(item.name);

   //bind the click event to li, since its being created at runtime
   $landmark.bind('click', function(){
        //get the value from li and set it to textbox
	$('#target-text-box-id').val($landmark.text());
   });

   //append to ul-output1
   $landmark.appendTo(output1);
});


Alternatively, you can also make use of jQuery on(). Inside $.each -
Create the li element with some class like -
JavaScript
var $landmark = $('<ul><li class="landmark-item" /></ul>').text(item.name);

and append to ul-output1.
Then write an event handler outside $.ajax() like -
JavaScript
//bind the click event to li, since its being created at runtime
$('.landmark-item').on('click', function(){
     //get the value from li and set it to textbox
     $('#target-text-box-id').val($(this).text());
});


Hope this works for you.
Thanks
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month


CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900