CODEWITHSUNDEEP
jqueryhtml
Ekta Shukla
Ekta Shukla

Reputation: 480

How to display data on hmtl5 page?

My html5 code is

     <div id="tablpolicy" align="middle">
                    <div class="policydiv">
                        <div class="left">
                            <span>Policy No.</span>
                        </div>
                        <div class="right">
                            <label for="policyno" data-inline="true" id="policylbl"></label> 
                        </div>
                    </div>
                    <div class="policydiv">
                        <div class="left">
                            <span>Quote No.</span> 
                        </div>
                        <div class="right">
                            <label for="quoteno" data-inline="true" id="quotelbl"></label>
                        </div>
                    </div>
                    <div class="policydiv">
                        <div class="left">
                            <span>Product Name</span>
                        </div>
                        <div class="right">
                            <label for="productname" id="productlbl"></label>
                        </div>
                    </div>
</div>

and my jquery code is 

 $.ajax({
        type:"GET",
        url:"webservices.xml",
        contentType:"text/plain; charset=UTF-8",
        success: function(data){
  var renewpolicy=  $(data).find("renewpolicy");
            var quotenumber=$(renewpolicy).find("QuoteNumber").text();
            var policyno=$(renewpolicy).find("PolicyNumber").text();
            var custid=$(renewpolicy).find("custid").text();
            var productname=$(renewpolicy).find("ProductName").text();
}
})

i parsed xml file and get quotenumber,policyno,custid,productname value.Now i want to disply these tags value on the above respective labels in the table.How to set these xml tags value to the abobe labels and which event should i have to use?can we use any query string for this? please help me. Thanks in advance!!

Upvotes: 0

Views: 68

Answers (3)

moonwave99
moonwave99

Reputation: 22817

You want to hear about jQuery selectors, then:

$.ajax({
    type:"GET",
    url:"webservices.xml",
    success: function(data){

        var renewpolicy =  $(data).find("renewpolicy");
        $('#policylbl').text( renewpolicy );

    }
});

Anyway I do not advice you to go this way - it's better to generate all the markup in the success callback [via templating] than injecting values in empty elements.

By the way you state your request format to be in contentType:"text/plain; charset=UTF-8", but you aren't providing any request body [i.e. parameters], so get over it.

Upvotes: 0

Tom
Tom

Reputation: 1334

in the success callback put the following.

$("#quotelbl").html(quotenumber);
$("#policylbl").html(policyno);
$("#productlbl").html(productname);

I can't see where your customerId label is though.

$("#quotelbl") is the jQuery selector. Here you put the name of your label with a hash in front.

.html() this is a jQuery function that either returns the html of an attribute, or if you pass a value into it, sets the html.

Upvotes: 1

alexbusu
alexbusu

Reputation: 741

In success callback function add at the end $(your_selector).html(your_text).

In you case you should use:

$('#policylbl').html( policyno );
$('#quotelbl').html( quotenumber );
$('#productlbl').html( productname );

You should decide what to do with the custid variable.

Upvotes: 1

Related Questions