Avatar of ITsolutionWizard
ITsolutionWizardFlag for United States of America asked on

jquery, html5, css

Below codes are working except I am not able to get loop listing  like below. My goal is to just html append to <div>
so the web page will show the UI and our end user can enter information.


 <div class="col-lg-12">
            <Input Type="text" Name="licenseNo" ID="additionalInfo_licenseNo" Onchange="fnSaveSingleData('licenseNo','1')" Placeholder="Enter License No." Class="form-control" Title="License is required!" PrefillValue="No" Required="" />
          </div>



<script> 
function fnGetBondAdditionalInformation() {
    $.ajax({
        url: "http://localhost:5489/BondList.xml",
        success: function (xml) {
            parseSelectXMLBondAdditionalInformation(xml, "test", localStorage.getItem('bondState'), localStorage.getItem('bondName'))
        },
        error: function (xhr, ajaxOptions, thrownError) {
            alert("Status: " + xhr.status);
            alert("Error: " + thrownError);
        }
    });
}
function parseSelectXMLBondAdditionalInformation(xml, selectid, bondState, bondName) {
    var html = "";
    var htmlOption = "";
    var additionalInfo = "";
    var selectedBondName = "";
    $('#' + selectid).prop("disabled", false);
    $(xml).find('Bond').each(function (i, e) {
        {
            if (bondState == $(e).find('GeneralInformation').find('State').text() && bondName == $(e).find('GeneralInformation').find('Name').text()) {
                selectedBondName = $(e).find('GeneralInformation').find('Name').text();
                additionalInformation = $(e).find('AdditionalInformation').find('div').text();
                $('#test').append(selectedBondName + " " + additionalInformation).html();
            }
        }
    });
    alert(selectedBondName);
}
window.onload = function () {
    fnGetBondAdditionalInformation();
}; 
</script>

<div id="test"></div>

<Surety>
  <SuretyLine>
    <Commercial>
      <Bond>
        <GeneralInformation UI="BondInfo">
          <Name ID="bondName" PrefillValue="Yes">Contractor License Bond</Name>
          <State ID="bondState" PrefillValue="Yes">CA</State>                     
        </GeneralInformation>       
        <AddtionalInformation>
          <div class="col-lg-12">
            <Input Type="text" Name="licenseNo" ID="additionalInfo_licenseNo" Onchange="fnSaveSingleData('licenseNo','1')" Placeholder="Enter License No." Class="form-control" Title="License is required!" PrefillValue="No" Required="" />
          </div>
          <div class="col-lg-12">
            <Input Type="text" Name="licenseNo" ID="additionalInfo_licenseNo2" Onchange="fnSaveSingleData('licenseNo2','1')" Placeholder="Enter License No." Class="form-control" Title="License is required!" PrefillValue="No"Required=""/>
          </div>
        </AddtionalInformation>     
      </Bond>  
      <Bond>
        <GeneralInformation UI="BondInfo">
          <Name ID="bondName" PrefillValue="Yes">Contractor License Bond</Name>
          <State ID="bondState" PrefillValue="Yes">FL</State> 
        </GeneralInformation>                   
        <AddtionalInformation>
          <div class="col-lg-12">
            <Input Type="text" Name="additionalInfo_licenseNo" ID="additionalInfo_licenseNo" Onchange="fnSaveSingleData(this.name,'1')" Placeholder="Enter License No." Class="form-control" Title="License is required!" PrefillValue="No" Required="" />
          </div>
        </AddtionalInformation>
   </Bond>        
  </Commercial>
  </SuretyLine>
</Surety>

Open in new window

CSSHTMLjQuery

Avatar of undefined
Last Comment
Göran Andersson

8/22/2022 - Mon
ASKER
ITsolutionWizard

any helps?
ASKER
ITsolutionWizard

any helps?
ASKER
ITsolutionWizard

Any helps?
This is the best money I have ever spent. I cannot not tell you how many times these folks have saved my bacon. I learn so much from the contributors.
rwheeler23
Göran Andersson

There are three problems with the code.

It's looking for an "AdditionalInformation" element in the XML, but the element is named "AddtionalInformation".
The text() method doesn't get the HTML code from the XML, it only gets the actual text from the HTML code. As there is no text but only an input element, the result will be an empty string.
You are getting the element, then looking for a div inside it. That means that you get only the input element, also that you only get the first input element.

Use this to get the HTML code from the XML:
additionalInformation = $(e).find('AddtionalInformation').html();

Open in new window

ASKER
ITsolutionWizard

It does not work. Can you try to combine your codes and my codes?
ASKER CERTIFIED SOLUTION
Göran Andersson

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
See how we're fighting big data
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question