2016-10-11 28 views
0

私は動的に表示されるxeditableフィールドを持っています。私はそれを更新するselect2を使用したい。Select2でXeditableが動作しない

$(document).ajaxComplete(function() { 

     $('.marketing_event_id').editable({ 
      emptytext: ".....", 
      url: "ajax_xeditable_update.php?table=appointments", 
      source: promo_codes, 
      select2: { 
       width: 200, 
       placeholder: 'Select promotion code...', 
       allowClear: true, 
      } 
     }); 


    }); 

//get the promo codes for the select2 box for xeditable. put it outside of ajaxcomplete so it doesn't keep firing off for every appt! 

    var promo_codes = []; 

    $.getJSON('ajax_get_json.php?what=location_promo_codes', function (data) { 

     $.each(data, function (index) { 
      promo_codes.push({ 
       id: data[index].value, 
       text: data[index].text 
      }); 
     }); 

    }); 

SELECT2ボックスは、ユーザーに適切にすべてのJSONのオプションを示していますが、オプションが選択されていると「チェックマーク」ボタンがフィールドを更新するために選択されている場合、何も起こりません。私はChromeのネットワーク画面を見ていて、XeditableフィールドのURLは起動しません。データフィールドが細かい移入され

echo '<h5>Promotion Code: <a href="#" class="marketing_event_id appointment' . $result->id . '" data-name="marketing_event_id" data-type="select2" data-value="'; if(!empty($result->marketing_event_id)) { echo $result->marketing_event_id; } echo '" data-placement="right" data-original-title="Enter the appointment promo code." data-pk="'. $result->id . '">' . $result->promo_code .'</a></h5> 

:ここ

は私のHTMLフィールドは次のようになります。私はそこに何か間違っているとは思わない。ここで

はSELECT2を移入するために使用されているgetJSON情報のサンプルです:

[{"value":"663","text":"christmas2015"},{"value":"651","text":"web08"},{"value":"658","text":"paper0815"}] 

必要であれば、私はより多くのコードを提供させていただきます。

誰でもフィールドが更新されたときにURLが起動しない理由を説明できますか?ありがとう。

答えて

0

私はこれを理解しましたが、なぜこれが機能するのかよくわかりません。

Iはxeditable領域にコードの行を追加:

$('.marketing_event_id').editable({ 
      emptytext: ".....", 
      container: 'body', <---- THIS IS WHAT I ADDED TO MAKE IT WORK!!!! 
      url: "ajax_xeditable_update.php?table=appointments", 
      source: promo_codes, 
      select2: { 
       width: 200, 
       placeholder: 'Select promotion code...', 
       allowClear: true, 
      } 
     }); 
関連する問題