2017-02-10 35 views
1

我的jQuery代碼:錯誤的日期選擇器查詢顯示HTML從阿賈克斯

$.datepicker.regional['fr'] = { 
    closeText: 'Fermer', 
    prevText: 'Précédent', 
    nextText: 'Suivant', 
    currentText: 'Aujourd\'hui', 
    monthNames: ['Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre'], 
    monthNamesShort: ['Janv.','Févr.','Mars','Avril','Mai','Juin','Juil.','Août','Sept.','Oct.','Nov.','Déc.'], 
    dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'], 
    dayNamesShort: ['Dim.','Lun.','Mar.','Mer.','Jeu.','Ven.','Sam.'], 
    dayNamesMin: ['D','L','M','M','J','V','S'], 
    weekHeader: 'Sem.', 
    dateFormat: 'dd/mm/yy', 
    firstDay: 1, 
    isRTL: false, 
    showMonthAfterYear: false, 
    yearSuffix: '' 
}; 
$.datepicker.setDefaults($.datepicker.regional['fr']); 

    $("#debutChargementMini").datepicker(); 
    $("#finChargementMini").datepicker(); 
    $("#debutChargementReel").datepicker(); 
    $("#finChargementReel").datepicker(); 
    $("#debutLivraisonMax").datepicker(); 
    $("#finLivraisonMax").datepicker(); 
    $("#debutLivraisonReelle").datepicker(); 
    $("#finLivraisonReelle").datepicker(); 

$('searchForm').submit(function(e) { 
    e.preventDefault(); 
}); 

$(document).ready(function() { 
    function eventFunction(){ 
     $.ajax({ 
     url: 'MODEL/ajaxSearchTransport.php', 
     type: 'post', 
     dataType: 'json', 
     data: $("#searchForm").serialize(), 
     success: function(data) { 
      //$('tbody').html(data.table); 
      //$('#ivalue').val(data.i); 
     $('tbody').html(data.htmlContenu); 
     $('#iValue').val(data.iValue); 
      alert(data.test); 
     }, 
     error: function() { 
     alert('La requête AJAX n\'a pas abouti, contactez l\'administrateur'); } 
     }); 
    }; 

    $('#numeroCommande').change(eventFunction); 
    $('#rechercheVilleChargement').change(eventFunction); 
    $('#rechercheVilleLivraison').change(eventFunction); 


    }); 

當我更改輸入打電話給我的AJAX功能,日曆的內容,當我點擊輸入在那裏我可以爲...通過使用ajax返回的html刷新數據,我在頁面上得到了什麼。正如你可以看到下面:

enter image description here

我試圖阿賈克斯成功後,初始化日期選擇器,但它是一樣的...

這裏是我的HTML:

<form id="searchForm"> 
      <div class="row text-center"> 
     <div class="col-md-3 form-group"> 
        <label>Ville de chargement</label> 
        <input type="text" class="form-control collectes-ville text-center" name="rechercheVilleChargement" placeholder="Chargement" id="rechercheVilleChargement"> 
        <label>Ville de livraison</label> 
        <input type="text" class="form-control collectes-ville text-center" name="rechercheVilleLivraison" placeholder="Livraison" id ="rechercheVilleLivraison"> 
     </div> 
       <div class="col-md-1 form-group"> 
       </div> 
       <div class="col-md-1 form-group"> 
        <label>Chargement mini</label> 
        <input type="text" id="debutChargementMini" class="form-control collectes-date-chargement-min text-center" name="debutChargementMini" placeholder="Date début" value=""> 
        <label><-></label> 
        <input type="text" id="finChargementMini" class="form-control collectes-date-chargement-min text-center" name="finChargementMini" placeholder="Date fin" value=""> 
       </div> 
       <div class="col-md-1 form-group"> 
        <label>Chargement réel</label> 
        <input type="text" id="debutChargementReel" class="form-control collectes-date-chargement-min text-center" name="debutChargementReel" placeholder="Date début" value=""> 
        <label><-></label> 
        <input type="text" id="finChargementReel" class="form-control collectes-date-chargement-min text-center" name="finChargementReel" placeholder="Date fin" value=""> 
       </div> 
       <div class="col-md-1 form-group"> 
        <label>Livraison maxi</label> 
        <input type="text" id="debutLivraisonMax" class="form-control collectes-date-chargement-min text-center" name="debutLivraisonMax" placeholder="Date début" value=""> 
        <label><-></label> 
        <input type="text" id="finLivraisonMax" class="form-control collectes-date-chargement-min text-center" name="finLivraisonMax" placeholder="Date fin" value=""> 
       </div> 
       <div class="col-md-1 form-group"> 
        <label>Livraison réelle</label> 
        <input type="text" id="debutLivraisonReelle" class="form-control collectes-date-chargement-min text-center" name="debutLivraisonReelle" placeholder="Date début" value=""> 
        <label><-></label> 
        <input type="text" id="finLivraisonReelle" class="form-control collectes-date-chargement-min text-center" name="finLivraisonReelle" placeholder="Date fin" value=""> 
       </div> 
       <div class="col-md-1 form-group"> 
       </div> 
       <div class="col-md-1 form-group"> 
        <label>N° de commande</label> 
        <input type="text" class="form-control collectes-ville text-center" id="numeroCommande" name="numeroCommande" placeholder="N° Commande"> 
        <label>Numéro d'OT</label> 
        <input type="text" class="form-control collectes-ville text-center" id="numeroOT" name="numeroOT" placeholder="Numero OT"> 
     </div> 
       <div class="col-md-2 form-group"> 
        <label>Statut</label> 
        <input type="text" class="form-control collectes-ville text-center" id="statut" name="statut" placeholder="Statut"> 
        <label>Transporteur</label> 
        <input type="text" class="form-control collectes-ville text-center" id="transporteur" name="transporteur" placeholder="Transporteur"> 
     </div> 
      </div> 
     </form> 

,我可以給你我的PHP文件,阿賈克斯要去哪裏。但是,它工作得很好。唯一的錯誤是datepicker。如果你需要看它,我會告訴你(它很長...)

回答

1

這個錯誤實際上並不是真正的錯誤。

事實上,我做了錯誤的錯誤是這樣寫:

$('tbody').html(data.htmlContenu); 

在我的JavaScript代碼。

如果您想從AJAX請求中返回HTML,您需要爲其創建帶有特殊ID的特殊div。否則,框架會給你帶來一些麻煩。因爲他們經常使用DOM元素。

我希望這會幫助別人。