2012-01-06 3 views
0

Je suis nouveau sur jquery. J'ai une forme jsp en ce que j'appelle la fonction javascript dans onload. Je veux charger des valeurs dans une liste déroulante qui est en iframe en utilisant jquery-1.4.2.js mais que je ne peux pas ajouter.en utilisant jquery ajouter des valeurs dans un combobox

s'il vous plaît une donner des solutions grâce à l'avance

entendre est mon code jsp

 <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="javascript:getStateCountryDetail(<%=companyId%>,1,<%=countryId%>, <%=stateId%>)"> 
     <table border="0" cellpadding="0" cellspacing="0" width="100%" > 
      <td width="100%" align="left" style="padding:3px" valign="top"> 
         <table border="0" width="100%" bordercolor="#cce7fa" cellpadding="0" cellspacing="0" style="border-collapse:collapse"> 
          <tr> 
           <td width="100%" align="left" valign="top"> 
            <iframe id = "applyMultipleInnerFrame" src ="/jsp/careers/applyMultipleCandidateResumeData.jsp?companyid=<%=companyId%>" name="applyMultipleInnerFrame" width="1100px" height="197px" frameborder="0" scrolling="Yes"></iframe> 
           </td> 
          </tr> 
</table> 
</td> 
</tr> 
</table> 
</form> 
</body> 

Entendre est mon iframe jsp

i contient la liste déroulante

<body> 
<form name="applyMultipleCandidateResumeData" method="POST" target="_top" action="http://<%=sName%>/jsp/careers/jobListingMainPage.jsp" enctype="multipart/form-data"> 
<table align="left" width="100%" border=1 bordercolor="#ff9900" cellspacing=0 cellpadding="0" style="border-collapse:collapse"> 
       <td nowrap width="10%" align="left" style="border-color:#ff9900;color: black; font: 11px verdana;padding:2px" > 
        <input type="text" maxlength="64" size="9" value="" name="candidateCity_<%= i %>" id="candidateCity_<%= i %>" /> 
       </td> 
       <td nowrap width="10%" align="left" style="border-color:#ff9900;color: black; font: 11px verdana;padding:2px" > 
         <select id = "candidateCountry_<%= i %>" name="candidateCountry_<%= i %>" class="controlStyle" onChange="loadState(this.value,'<%=i%>');"> 
          <option value="0">-------- Select --------</option> 
        </select> 
       </td> 
       <td nowrap width="10%" align="left" style="border-color:#ff9900;color: black; font: 11px verdana;padding:2px" > 
       <select id="candidateState_<%= i %>" name="candidateState_<%= i %>" class="controlStyle"> 
        <option value="0">----------- Select ---------</option> 
       </select> 
       </td> 
</table> 
</form> 
</body> 

i utilisez le code suivant pour obtenir l'objet iframe en utilisant jqu rès mais je ne sais pas si ce exact ou non

var frm = $("#applyMultipleInnerFrame").contents()); 

Voici mon code jquery

xmlDoc est ma réponse jsone qui contient la liste des pays

var frm = $("#applyMultipleInnerFrame").contents()); 
for(var i=0;i<5;i++) { 
    if ($(frm).find('input[name=candidateCountry_' + i + ']') && $(frm).find('input[name=candidateCountry_' + i + '] option')) { 
     $(frm).find('input[name=candidateCountry_' + i + '] option').length = 0; 
     if (xmlDoc.countryList) { 
      $(frm).find('input[name=candidateCountry_' + i + '] option')[$(frm).find('input[name=candidateCountry_' + i + '] option').length] = new Option("-- Select --", 0); 
      for (var k = 0; k < xmlDoc.countryList.length; k++) { 
       $(frm).find('input[name=candidateCountry_' + i + '] option')[$(frm).find('input[name=candidateCountry_' + i + '] option').length] = new Option(xmlDoc.countryList[k].name, xmlDoc.countryList[k].id); 

       if ((xmlDoc.countryList[k].id) == dCountryId) { 
        alert($($(frm).find('input[name=candidateCountry_' + i + ']').text())); 
        //alert($(frm).find('input[name=candidateCountry_'+i+']').val(dCountryId).text()); 
        //$(frm).find('input[name=candidateCountry_"+i+"] option').eq(dCountryId).attr('selected', 'selected'); 
       } 
      } 
     } 
     //alert($(frm).find('input[name=candidateCountry_'+i+']) option:selected').text()); 
     //processAjaxRequestPost('ajaxRequestPost','SingleListHandler','getStateListDetails', eval('frm.candidateCountry_'+i).options[eval('frm.candidateCountry_'+i).selectedIndex].value); 
    } 
} 
+0

Vous devriez vraiment cache '$ (FRM)' au lieu d'appeler encore et : 'var $ frm = $ (frm);' et ensuite utiliser '$ frm' – ThiefMaster

Répondre

0

Pour autant que je sache, vous pouvez 't (facilement) modifier le contenu des iframes, car ils ont leur propre DOM. Si le contenu de l'iframe vient de vous, (disons, page1.html contient un iframe contenant page2.html), et non une source externe, vous pouvez brancher votre script dans page2.html pour que vous n'ayez pas à faire de croix -DOM tours (j'ai été là - ça craint).

P.S. Votre code a l'air d'avoir avalé une arme nucléaire. Si vous avez nettoyé le code et affiché seulement les parties pertinentes je suis sûr que vous obtiendrez plus d'aide de cette façon;)

0

Pour accéder au contenu d'un iframe, vous devez utiliser .contents(). méthode

Les .contents() peut également être utilisé pour obtenir le document de contenu de un iframe, si l'iframe est sur le même domaine que la page principale.


maintenant votre code, vraiment désordre.
Voici quelques points à garder à l'esprit lors de l'écriture du code jquery:

  • interrogation est pas efficace, cache aussi souvent que possible vos requêtes (pour les éléments fixes par exemple)

    var $frm = $(frm); // then use $frm 
    
  • à créer un balisage, le moyen le plus efficace est de construire le code HTML en tant que texte et d'ajouter le bloc entier à la fois.

  • jQuery('') (or $('')) retourne toujours un objet.Pour vérifier votre requête a retourné un résultat, vérifiez la length propriété

Voici un morceau de code optimisé:

// cache the elements you're going to use  
var $frm = $(frm), 
    $candidCountry = $(frm).find('input[name=candidateCountry_' + i + ']'); 

// always check the length property to verify your query returned results 
// because $('') always returns 
if ($candidCountry.length && $candidCountry.find('option').length) { 

    var html; 

    if (xmlDoc.countryList) { 

     // build the html as text 
     html += '<option value="0">-- Select --</option>'; 

     for (var k = 0; k < xmlDoc.countryList.length; k++) { 
      html += '<option value="'+xmlDoc.countryList[k].id+'">'+xmlDoc.countryList[k].name+'</option>'; 
     } 
    } 

    // append the whole html at once 
    $candidCountry.html(html); 
} 
+0

merci pour votre réponse .... j'ai changé mon style de code à votre style de code, mais je ne reçois pas de résultat. S'il vous plaît dites-moi comment puis-je obtenir l'objet iframe en utilisant jquery – Mouli

+0

Je pense que vous devriez utiliser 'var $ candidCountry = $ (" # applyMultipleInnerFrame "). contents(). find ('entrée [name = candidateCountry_' + i + ']') ' –

+0

cadre id = applyMultipleInnerFrame et iframe jsp formulaire id = applyMultipleCandidateResumeData j'essaie d'obtenir l'objet formulaire var frm = $ ('# applyMultipleInnerFrame'). Contents(). Find ('# applyMultipleCandidateResumeData'); – Mouli

Questions connexes