获取在jquery中选择的值，否则循环

Question

我创建了一个包含多个选择框和一个产品价格输入元素的表单。

根据在不同选择框中选择的值，输入中的价格会发生变化。

我想将所选价格的值“捕获”到以下脚本中，因为我需要将其传递给ajax函数，以便传递给我的控制器之一。

已经尝试过

$('#productprice').val();

但在控制台中返回null。

如果有人知道如何做，将非常感谢，马克，

$(window).bind('change', function() {

var id = $('#orderID').val(); // producttypeID
// console.log('orderID:', id);
var d1 = $('#producttype_ID').val(); // producttypeID
// console.log('producttype ID:', d1);
var d2 = $('#productname').val();
// console.log('product ID:', d2);
var d3 = $('#dessertservingID').val(); // dessertservingID
// console.log('Servings:', d3);
var pl1 = $('#portion_ID').val(); // partyloafportionID
// console.log('pl1:', pl1);
var pl2 = $('#partyloafweightID').val(); // partyloafweightID
// console.log('pl2:', pl2);

if (d1 == '' && d2 == '' && d3 == '' && pl1 == '' && pl2 == '') { $('#productprice').val('0.00'); }
else if (d1 == 1 && d2 == 1 && d3 == 1 && pl1 == '' && pl2 == '') { $('#productprice').val('19.00'); }
else if (d1 == 1 && d2 == 1 && d3 == 2 && pl1 == '' && pl2 == '') { $('#productprice').val('24.00'); }
else if (d1 == 1 && d2 == 1 && d3 == 3 && pl1 == '' && pl2 == '') { $('#productprice').val('32.00'); }
else if (d1 == 1 && d2 == 1 && d3 == 4 && pl1 == '' && pl2 == '') { $('#productprice').val('40.00'); }
else if (d1 == 1 && d2 == 1 && d3 == 5 && pl1 == '' && pl2 == '') { $('#productprice').val('48.00'); }
else if (d1 == 1 && d2 == 1 && d3 == 6 && pl1 == '' && pl2 == '') { $('#productprice').val('65.00'); }

})

var productpricenew = $('#productprice').val();
console.log(productpricenew); // RETURNED NULL

    $.ajax({
type: 'get',
url: 'AdminMesCommandesNonTraiteesController.php',
data: { key : productpricenew },
    success: function (data) {
        // alert(data);
    }

}）

HTML页面

                <form class="form-horizontal" method="post" id="form" enctype="multipart/form-data" action="http://mage.webamazingapps.com/admin/mes_commandes_non_traitees/edit-save/486">
                <input type="hidden" name="_token" value="5cRV8KQndxim6aoTYdW7YX0eylL5AzPSBnqCfLZl">
                <input type="hidden" name="return_url" value="http://mage.webamazingapps.com/admin/mes_commandes_non_traitees">
                <input type="hidden" name="ref_mainpath" value="http://mage.webamazingapps.com/admin/mes_commandes_non_traitees">
                <input type="hidden" name="ref_parameter" value="return_url=http://mage.webamazingapps.com/admin/mes_commandes_non_traitees&amp;parent_id=&amp;parent_field=">
                <div class="box-body" id="parent-form-area">

                    <div class="form-group header-group-0 " id="form-group-orderID" style="">
                    <label class="control-label col-sm-2"># Commande</label>

                        <div class="col-sm-10">
                        <input type="text" title="# Commande" disabled="" class="form-control" name="orderID" id="orderID" value="360">

                        <div class="text-danger"></div>
                        <p class="help-block"></p>

                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-statusorderID" style="">
                    <label class="control-label col-sm-2">Statut Commande</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="statusorderID" data-value="2" name="statusorderID">
                                <option value="">** Veuillez saisir une option Statut Commande</option>
                                <option value="5">Achevée</option>
                                <option value="1">Annulée</option>
                                <option value="4">En traitement</option>
                                <option selected="" value="2">Non traitée</option>
                                <option value="3">Ouverte</option>
                            </select>
                            <div class="text-danger"></div>
                            <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-statuslaboID" style="">
                    <label class="control-label col-sm-2">Statut Laboratoire</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="statuslaboID" data-value="1" name="statuslaboID">
                                <option value="">** Veuillez saisir une option Statut Laboratoire</option>
                                <option selected="" value="1">Assignée</option>
                                <option value="2">Prise en charge</option>
                                <option value="3">Réalisée</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-userID" style="">
                    <label class="control-label col-sm-2">Nom</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="userID" data-value="3" disabled="" name="userID">
                                <option value="">** Veuillez saisir une option Nom</option>
                                <option value="86"></option>
                                <option value="90">Admin Mage Deux</option>
                                <option value="12">Admin Mage Un</option>
                                <option value="88">asadmahmood</option>
                                <option value="87">Client Cinq</option>
                                <option selected="" value="3">Client Deux</option>
                                <option value="19">Client Quatre</option>
                                <option value="89">Client Six</option>
                                <option value="17">Client Trois</option>
                                <option value="2">Client Un</option>
                                <option value="10">Laborantin Cinq</option>
                                <option value="7">Laborantin Deux</option>
                                <option value="9">Laborantin Quatre</option>
                                <option value="11">Laborantin Six</option>
                                <option value="8">Laborantin Trois</option>
                                <option value="4">Laborantin Un</option>
                                <option value="6">Passeur Deux</option>
                                <option value="5">Passeur Un</option>
                                <option value="1">Super Admin Un</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-roleID" style="">
                    <label class="control-label col-sm-2">Nature
                    </label>

                        <div class="col-sm-10">
                            <select class="form-control" id="roleID" data-value="3" disabled="" name="roleID">
                                <option value="">** Veuillez saisir une option Nature</option>
                                <option value="2">Administrateur Mage</option>
                                <option value="7">Artisan Laboratoire Boulanger "Claude" Mage</option>
                                <option value="6">Artisan Laboratoire Boulanger "Pascale" Mage</option>
                                <option value="9">Artisan Laboratoire Chocolat Mage</option>
                                <option value="8">Artisan Laboratoire Cuisine Mage</option>
                                <option value="10">Artisan Laboratoire Magasin Mage</option>
                                <option value="5">Artisan Laboratoire Pâtissier Mage</option>
                                <option selected="" value="3">Client Mage</option>
                                <option value="4">Passeur Commandes Mage</option>
                                <option value="1">Super Administrator</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group form-datepicker header-group-0 " id="form-group-deliverydate" style="">
                    <label class="control-label col-sm-2">Date Retrait
                    <span class="text-danger" title="Ce champ est obligatoire">*</span>
                    </label>

                        <div class="col-sm-10">
                            <div class="input-group">
                            <span class="input-group-addon open-datetimepicker"><a><i class="fa fa-calendar "></i></a></span>
                            <input type="text" title="Date Retrait" readonly="" required="" class="form-control notfocus input_date" name="deliverydate" id="deliverydate" value="06-03-2019">
                            </div>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>

                    <div class="form-group header-group-0 " id="form-group-producttype_ID" style="">
                    <label class="control-label col-sm-2">Catégorie</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="producttype_ID" data-value="1" disabled="" name="producttype_ID" required="">
                                <option value="">** Veuillez saisir une option Catégorie</option>
                                <option selected="" value="1">Gâteaux</option>
                                <option value="4">Pain-surprise</option>
                                <option value="2">Tarte</option>
                                <option value="3">Tarte-fine</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-productname" style="display: block;">
                    <label class="control-label col-sm-2">Produit</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="productname" data-value="3" name="productname" required="">
                                <option value="">** Veuillez saisir une option Produit</option>
                                <option value="1">Chocolat</option>
                                <option value="6">Forêt-noire avec alcool sans cerise</option>
                                <option value="4">Forêt-noire avec cerises et alcool</option>
                                <option value="5">Forêt-noire avec cerises et sans alcool</option>
                                <option value="7">Forêt-noire sans alcool sans cerise</option>
                                <option value="13">Mille-feuilles chantilly fraise</option>
                                <option value="14">Mille-feuilles chantilly framboise</option>
                                <option value="12">Mille-feuilles traditionnel</option>
                                <option value="8">Mousse au chocolat</option>
                                <option value="9">Mousse fraise</option>
                                <option value="10">Mousse framboise</option>
                                <option value="11">Mousse passion</option>
                                <option value="2">Pavé aux fraises</option>
                                <option selected="" value="3">Pavé aux framboises</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-dessertservingID" style="display: block;">
                    <label class="control-label col-sm-2"># Personnes
                    </label>

                        <div class="col-sm-10">
                            <select class="form-control" id="dessertservingID" data-value="9" name="dessertservingID" required="">
                                <option value="">** Veuillez saisir une option # Personnes</option>
                                <option value="7">10-12 pers.</option>
                                <option value="8">12-14 pers.</option>
                                <option selected="" value="9">14-16 pers.</option>
                                <option value="10">16-18 pers.</option>
                                <option value="1">2-3 pers.</option>
                                <option value="11">20-24 pers.</option>
                                <option value="2">3-4 pers.</option>
                                <option value="3">4-6 pers.</option>
                                <option value="4">5-7 pers.</option>
                                <option value="5">6-8 pers.</option>
                                <option value="6">8-10 pers.</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-desserttextmessage" style="display: block;">
                    <label class="control-label col-sm-2">Inscription</label>
                        <div class="col-sm-10">
                        <textarea name="desserttextmessage" id="desserttextmessage" class="form-control" rows="5"></textarea>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-dessertdecorflowerID" style="display: block;">
                    <label class="control-label col-sm-2">Décoration petites fleurs</label>
                        <div class="col-sm-10">

                        <div class=" ">
                            <label class="radio-inline">
                            <input type="radio" checked="" name="dessertdecorflowerID" value="0"> Pas de décoration petites fleurs
                            </label>
                        </div>
                        <div class=" ">
                            <label class="radio-inline">
                            <input type="radio" name="dessertdecorflowerID" value="1"> Décoration petites fleurs souhaitée
                            </label>
                        </div>

                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-dessertdecorchocolateID" style="display: block;">
                    <label class="control-label col-sm-2">Décoration Chocolat et fruits</label>
                        <div class="col-sm-10">


                        <div class=" ">
                            <label class="radio-inline">
                            <input type="radio" checked="" name="dessertdecorchocolateID" value="0"> Pas de décoration chocolat et fruits
                            </label>
                        </div>
                        <div class=" ">
                            <label class="radio-inline">
                            <input type="radio" name="dessertdecorchocolateID" value="1"> Décoration chocolat et fruits souhaitée
                            </label>
                        </div>

                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-ID_portion" style="display: none;">
                    <label class="control-label col-sm-2">Nombre de sandwiches</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="portion_ID" data-value="" name="portion_ID">
                                <option value="">** Veuillez saisir une option Nombre de sandwiches</option>
                                <option value="4">100</option>
                                <option value="1">30</option>
                                <option value="2">60</option>
                                <option value="3">80</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-partyloafsandwich1ID" style="display: none;">
                    <label class="control-label col-sm-2">Sandwiches 1</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="partyloafsandwich1ID" data-value="" name="partyloafsandwich1ID">
                                <option value="">** Veuillez saisir une option Sandwiches 1</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-partyloafsandwich2ID" style="display: none;">
                    <label class="control-label col-sm-2">Sandwiches 2
                    </label>

                        <div class="col-sm-10">
                            <select class="form-control" id="partyloafsandwich2ID" data-value="" name="partyloafsandwich2ID">
                                <option value="">** Veuillez saisir une option Sandwiches 2</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-partyloafsandwich3ID" style="display: none;">
                    <label class="control-label col-sm-2">Sandwiches 3
                    </label>

                        <div class="col-sm-10">
                            <select class="form-control" id="partyloafsandwich3ID" data-value="" name="partyloafsandwich3ID">
                                <option value="">** Veuillez saisir une option Sandwiches 3</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-partyloafsandwich4ID" style="display: none;">
                    <label class="control-label col-sm-2">Sandwiches 4
                    </label>

                        <div class="col-sm-10">
                            <select class="form-control" id="partyloafsandwich4ID" data-value="" name="partyloafsandwich4ID">
                                <option value="">** Veuillez saisir une option Sandwiches 4</option>
                            </select>
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-partyloafribbonID" style="display: none;">
                    <label class="control-label col-sm-2">Couleur Ruban</label>

                        <div class="col-sm-10">
                            <select class="form-control" id="partyloafribbonID" data-value="" name="partyloafribbonID">
                                <option value="">** Veuillez saisir une option Couleur Ruban</option>
                            </select>
                            <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-productprice" style="display: block;">
                    <label class="control-label col-sm-2">Prix</label>

                        <div class="col-sm-10">
                        <input type="number" step="1" title="Prix" class="form-control" name="productprice" id="productprice" value="19.00">
                        <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-productaddfee" style="display: block;">
                    <label class="control-label col-sm-2">Supplément
                    </label>

                        <div class="col-sm-10">
                            <input type="number" step="1" title="Supplément" class="form-control" name="productaddfee" id="productaddfee" value="5.00" required="">
                            <div class="text-danger"></div>
                            <p class="help-block"></p>
                        </div>
                    </div>    

                    <div class="form-group header-group-0 " id="form-group-total" style="display: block;">
                    <label class="control-label col-sm-2">Total
                    </label>

                        <div class="col-sm-10">
                            <input type="number" step="1" title="Total" class="form-control" name="total" id="total" value="0.00">
                            <div class="text-danger"></div>
                        <p class="help-block"></p>
                        </div>
                    </div>    

                </div><!-- /.box-body -->

                <div class="box-footer" style="background: #F5F5F5">

                <div class="form-group">
                    <label class="control-label col-sm-2"></label>
                <div class="col-sm-10">
                    <a href="http://mage.webamazingapps.com/admin/mes_commandes_non_traitees" class="btn btn-default"><i class="fa fa-chevron-circle-left"></i> Retour en arrière</a>

                    <input type="submit" name="submit" value="Enregistrer" class="btn btn-success">

                </div>
                </div>

                </div><!-- /.box-footer-->

            </form>

此CRUD是由Crubooster为Laravel提供的一种Adminlte软件包生成的。

Answer 1

解决方案：

我找到了解决方案（部分是因为我还没有找到将这些值传递给我的Controller的方法，这将是另一个问题的一部分）：

Ajax调用：

...
else if (d1 == 4 && d2 == 27 && d3 == '' && pl1 == 2 && pl2 == 2) { $('#productprice').val('59.00'); }
else if (d1 == 4 && d2 == 27 && d3 == '' && pl1 == 3 && pl2 == 3) { $('#productprice').val('69.00'); }
else if (d1 == 4 && d2 == 27 && d3 == '' && pl1 == 4 && pl2 == 4) { $('#productprice').val('79.00'); }
else if (d1 == 4 && d2 == 27 && d3 == '' && pl1 == 4 && pl2 == 5) { $('#productprice').val('89.00'); }

var rowID = rowid;
var orderID = $('#orderID').val();
var productprice_new = $('#productprice').val();
console.log(productprice_new,rowID,orderID);

$.ajax({
type: 'post',
url: '/assets/ajax/ajaxupdate.php',
data:  {
        'rowid' : rowid,
        'orderID' : orderID,
        'productprice_new' : productprice_new,
        },
            success: function (data) {
                console.log('worked!');
            },
            error: function (data) {
                console.log('Error:', data);
            }
})

正确返回3个值

现在我需要将这些值传递给控制器​​，这是我一整天都在尝试的方法，但这将是另一个问题的一部分。