2010-07-28 5 views
1

Je ne sais pas pourquoi cela fonctionne, mais pas quand je passe en nombrePas en mesure d'ajouter des options pour sélectionner

<form id="form1" runat="server"> 
    <div id="facebookPhotos-iFrameContent"> 
     <div> 
      <p>Log in</p> 
      <p id="LoginButtonContainer"><input type="image" id="btnLogin" src="images/loginBtn.jpg" /></p> 
      <p><select id="facebookAlbumDropdown" /></p> 
      <div id="facebookPhotosContainer" /> 
     </div> 
    </div> 
</form> 

AddDropdownItem("-Select something test-", "-1", "testDropdown"); 

function AddDropdownItem(sText, sValue, sDropdownID) 
{ 
     $("#" + sDropdownID).append("<option value=" + sValue + ">" + sText + "</option>"); 
} 

qui fonctionne

mais cela ne veut pas:

var id = 104388426283811; 
AddDropdownItem("-Select something test-", id.toString(), "testDropdown"); 

Qu'est-ce qui se passe est le d L'option efault apparaît mais quand elle essaie d'ajouter la deuxième option, elle bombe sans erreurs que je peux voir dans la console firebug et à la fin la liste devient vide (pas d'options) quand mon code est exécuté.

+1

J'ai pris votre code et l'ai mis dans un simple fichier HTML à tester. Je n'ai pas eu d'erreurs - les options étaient bien chargées. Je l'ai fait dans IE8 et FF3.6. Pouvez-vous poster plus de votre code? Je ne suis pas sûr de l'option par défaut dont vous parlez (est-ce le premier ajouté)? Peut-être que cela cause le problème? –

+0

Ok, ce code fonctionne (sans le toString que j'avais déjà essayé) mais n'aime pas la dernière option que j'essaie d'ajouter. Voici les paramètres entrants de la méthode add: sText: "Profile Pictures" sValue = 100001379631246 sDropdownID = "testDropdown" – PositiveGuy

+0

et voici le premier (et bien deuxième ..après l'option par défaut) qui semble être bien et ajouté avec succès: sText = "Test Test2" sValue = 104388426283811 sDropdownID = "testDropdown" – PositiveGuy

Répondre

0

Basé sur le fil de commentaire dans la question initiale, voici mon exemple de page qui intègre votre logique (avec câblage un bouton pour ajouter des options à la sélection):

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>jQuery Test</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
<script language="javascript"> 
    $(document).ready(function() { 
     $("#btnClick").click(function(e) { 
      e.preventDefault(); 
      var id = 104388426283811; 
      AddDropdownItem("-Select something test-", id.toString(), "testDropdown"); 
      //AddDropdownItem("-Select something test-", "-1", "testDropdown"); 
     }); 
    }); 

    function AddDropdownItem(sText, sValue, sDropdownID) 
    { 
      $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>"); 
    } 
</script> 
</head> 
<body> 

<input id='btnClick' type='submit' value='click'></input> 
<p><select name="MyTestDropdown" id="testDropdown"></select></p> 


</body> 
</html> 

Je n'ai pas iframes que vous avez mentionné, mais j'utilise un élément input submit pour ajouter des éléments. J'empêche le comportement par défaut d'un bouton d'envoi en appelant e.preventDefault();, qui empêche ensuite la publication. Je suis alors en mesure d'ajouter des éléments à l'élément select.

J'espère que cela aide.

+0

alors après que le DOM se soit chargé, ça vous renvoie quoi? le DOM en tant qu'objet? – PositiveGuy

+0

Je vois que vous utilisez également un submit, le mien est une image – PositiveGuy

+0

J'ai ajouté plus de mon code dans le fil d'origine ... – PositiveGuy

1

Essayez de mettre la valeur entre guillemets simples, comme ceci:

function AddDropdownItem(sText, sValue, sDropdownID) 
{ 
     $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>"); 
} 

Vous avez demandé: « Pourquoi cette question. » La réponse. C'est une bonne pratique qui prévient les problèmes lorsque vos valeurs commencent à contenir des espaces. Je MET TOUJOURS les valeurs d'attribut entre guillemets. Maintenant, pour votre problème ... Je l'ai juste essayé avec le code suivant et ça fonctionne comme un charme!

<p><select name="MyTestDropdown" id="testDropdown"></select></p> 

<script type="text/javascript"> 
    $(document).ready(function() { 

     AddDropdownItem("-Select something test-", "-1", "testDropdown"); 
     AddDropdownItem("something else", "1", "testDropdown"); 
     AddDropdownItem("another thing", 2, "testDropdown"); 

     var id = 104388426283811; 
     AddDropdownItem("test big value", id.toString(), "testDropdown"); 

     AddDropdownItem("Profile Pictures", 100001379631246, "testDropdown"); 

     AddDropdownItem("Test Test2", 104388426283811, "testDropdown"); 

    }); 
    function AddDropdownItem(sText, sValue, sDropdownID) 
    { 
     $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>"); 
    } 
</script> 

Votre code original fonctionne aussi. Je ne pense pas qu'il y avait un problème avec ça. :) Peut-être que vous avez un problème ailleurs dans votre code?

+0

Pourquoi est-ce important? – PositiveGuy

+0

afin de se débarrasser ou de tolérer des espaces? mettre dans les guillemets simples? – PositiveGuy

+0

Il tolérerait des espaces. Pas un gros problème pour les chiffres ou quand vous avez toujours un mot, mais si vous avez l'habitude de toujours utiliser des guillemets (simples ou doubles), vous vous libérez de beaucoup de problèmes à l'avenir. –

2

JavaScript interprétera les entiers comme des chaînes si nécessaire, il n'est pas nécessaire d'utiliser toString().

+0

id est un type primitif? il est défini sur un entier – PositiveGuy

+0

Cela ne fait aucune différence puisque id est un int. toString() ou non, ça marche bien. –

Questions connexes