2009-09-21 11 views
1

J'essaie d'utiliser jQuery pour combiner les choix de champs de sélection de l'utilisateur (catégorie + contributeurs) et insérer ceci dans un champ caché avec un identifiant de as_q, mais quand je lance le script la valeur de as_q est toujours vide.Affectation d'une variable avec le problème jQuery

Pour l'instant, j'appelle la fonction lorsque l'utilisateur clique sur submit - il obtient la valeur des deux champs select et les combine, avant de les affecter au champ as_q - du moins c'est ma logique.

Peut-être que j'ai le mauvais endroit? Mon code actuel est ci-dessous. Toute aide grandement appréciée, merci

<form action="<? echo $PHP_SELF;?>" method="get" id="cse-search-box"> 
    <input type="text" name="q" size="31"/> 
    <select name="category"> 
    <option>Movies</option> 
    <option>Film</option> 
    <option>Fashion</option> 
    </select> 
    <select name="contributors"> 
    <option>One</option> 
    <option>Two</option> 
    <option>Three</option> 
    </select> 
    <input type="hidden" name="as_q" id="as_q" value="" /> 
    <input type="submit" name="sa" value="Search" id="submit_query" /> 
</form> 

<script>  
    $('#submit_query').click(function(){ 
    var category = $('[name=category]').val(); 
    var contributors = $('[name=contributors]').val(); 

    $('[#as_q]').val(category+' '+contributors); 

    }); 
</script> 
+0

Mettre votre code dans une page de résultats de test dans ça marche bien dans FF3.5. Pouvez-vous fournir plus de détails? – Steerpike

+0

J'ai essayé une page de test moi-même en dehors du serveur de déploiement, et cela ne fonctionne pas correctement non plus - je regarde la section as_q dans l'url, qui est vide. Puis-je vous demander comment vous testez que les deux champs ont été combinés en as_q? Peut-être que cela va m'aider à fournir des informations plus précises? – Gibset

+0

Je recommande vraiment d'utiliser pastehtml.com pour des questions comme celle-ci. http://pastehtml.com/view/090921UbqT7OfJ.html – itsadok

Répondre

1

Juste une supposition - se débarrasser des crochets de ...

$('[#as_q]').val(category+' '+contributors); 
+0

Je l'ai réalisé après avoir soumis la question, mais ce n'est pas le problème, merci – Gibset

0

Ne pas mettre des crochets autour « as_q ». Aussi, ne faites pas cela sur le clic du bouton d'envoi. Cela ne va pas capturer toutes les façons dont un formulaire peut être soumis. Au lieu de le faire sur le formulaire soumettre événement:

$("#cse-search-box").submit(function() { 
    var category = $('[name=category]').val(); 
    var contributors = $('[name=contributors]').val(); 
    $('#as_q').val(category+' '+contributors); 
}); 

Note: appelant form.submit() contournera ce gestionnaire aussi (sur certains navigateurs), mais ça va contourner votre événement click() de toute façon.

+0

Je le faisais de cette façon à l'origine, mais cela ne semble pas fonctionner non plus. Les deux façons de laisser as_q vide ... Je ne suis pas un expert par tous les moyens donc à une perte ici! Toute aide supplémentaire appréciée. – Gibset

1

Outre les autres suggestions:

1 - Mettez votre code dans un bloc $(document).ready(.... Cela pourrait être la raison pour laquelle cela ne fonctionne pas.

2 - Donnez vos ID sélects pour de meilleures performances, attribute filters (comme [name = blah]) ne sont pas la manière la plus simple de sélectionner des éléments.

$(document).ready(function() { 
    $('#submit_query').click(function(){ 
     var category = $('#category').val(); 
     var contributors = $('#contributors').val(); 
     $('#as_q').val(category + ' ' + contributors); 
    }); 
}); 
+0

Merci pour les suggestions, j'utilise des sélecteurs d'ID maintenant. J'ai enveloppé le code dans le bloc doc ready, mais toujours pas de chance - vraiment confus quant à savoir pourquoi cela ne fonctionne pas! – Gibset

1

Voici le code de test que j'utilise qui vous permet de faire fonctionner correctement votre code.

Le fichier est appelé sandbox.php (Je mentionne cela comme la seule chose qui est vraiment inconnu est si vous avez donné votre fichier une extension .php)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<!-- Above Doctype should provide S mode in Moz, Safari, Opera, IE8 and A (almost standards) in IE6/7 --> 
<head> 
    <meta http-equiv="Content-Type" content="application/text+html;utf-8"> 

    <title>Sandbox</title> 
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet"> 
    <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> 
    <script src="http://dev.jquery.com/view/tags/ui/latest/ui/effects.core.js"></script> 

<script type="text/javascript"> 
    $(document).ready(function() { 
    $('#submit_query').click(function(){ 
    var category = $('[name=category]').val(); 
    var contributors = $('[name=contributors]').val(); 

    $('#as_q').val(category+' '+contributors); 
    }); 
    }); 

</script> 
</head> 
<?php 
if(isset($_REQUEST['as_q'])) { 
    echo $_REQUEST['as_q']; 
} 
?> 
<body class="calendarPage"> 
<form action="#" method="get" id="cse-search-box"> 
    <input type="text" name="q" size="31"/> 
    <select name="category"> 
    <option>Movies</option> 
    <option>Film</option> 
    <option>Fashion</option> 
    </select> 
    <select name="contributors"> 
    <option>One</option> 
    <option>Two</option> 
    <option>Three</option> 
    </select> 
    <input type="hidden" name="as_q" id="as_q" value="" /> 
    <input type="submit" name="sa" value="Search" id="submit_query" /> 
</form> 


    </body> 


</html> 
+0

Bien, merci - en utilisant votre code sur le serveur de développement, tout fonctionne bien. Pour autant que je sache, la seule différence entre mon code et le vôtre est la version de jQuery qui est utilisée sur le site pour lequel je suis en train de développer - 1.2.6. Je ne connais pas les différences entre les versions, mais je n'aurais pas pensé que c'était le problème? Sauf si la jquery incluse, qui est stockée localement sur le serveur, a été modifiée? Je vais enquêter et essayer d'obtenir plus d'informations! – Gibset

Questions connexes