1

私はjqueryをほとんど知らないので、あまり意味がない場合は失礼します。

php dbクエリから行が入力されるというテーブルがあります（行数は異なります）。この場合、2行のデータがあります。これは、phpで生成されたhtmlテーブルの一部です。

<table border=1 width=800px id=workout>
 <tr>
 <th width=300px id=clients>Client</th>
 <th width=200px id=movements>Movements</th>
 <th>X Completed</th>
 </tr>

<tr>
<td><input type="hidden" name="client_id[]" class="clientval" value="1"></td>   
<td>
<select name="movement[]" width=200 class='typeval' onchange='changeMovement()'>
              <option value="select">Select...</option>
              <option>Key Movement</option>
              <option>Movement -1</option>
              <option selected="selected" >Movement -2</option>
              <option>Movement -3</option>
              <option>Movement -4</option>
        </select>
</td>
<td><label id="count"></label></td>
</tr>

<tr>
<td><input type="hidden" name="client_id[]" class="clientval" value="8">
<td>
<select name="movement[]" width=200 class='typeval' onchange='changeMovement()'>
              <option value="select">Select...</option>
              <option>Key Movement</option>
              <option>Movement -1</option>
              <option selected="selected" >Movement -2</option>
              <option>Movement -3</option>
              <option>Movement -4</option>
        </select>
</td>
<td><label id="count"></label></td>
</tr>

movementとの値をjqueryclient_idに渡してPOST、データに対してphpクエリを実行して結果を返すことができるようにします。選択メニューが含まれている行に基づいて、選択した移動とclient_idの値を渡すにはどうすればよいですか。

例：ユーザーが2行目の移動ドロップダウンメニューを変更した場合、client_idとselected>Movement<をjQuery関数に送信します。今は私のテーブルの最初の行を取得しているだけで、それだけです。

これが私の編集したjQueryです：

編集：

<script type="text/javascript">

var typeval,clientval, class_id;
$('.typeval').on('change', function(){
    movement =  $(".typeval option:selected").val();
    client_id = $(this).parents('tr').find('input.clientval').val();
    class_id = $(<? echo $class_id; ?>).val();

    //console.log($(this).parents('tr').find('input.clientval').val(), $(this).val());
    $.ajax(
    { url: "movement_count.php",
      type: "post",
      data: {typeval:typeval, client_id: clientval, class_id :},
      dataType: "json",
      });

    success: (function(output) {
    alert(output);
    $(".count").html(output);
    })
 });

</script>
4

5 に答える 5

2

jQueryを使用しているので、このようにします。インラインJavaScriptを削除し、select要素のchangeイベントにバインドします。

var typeval,clientval;
$('select.typeval').change(function() {
    //console.log($(this).parents('tr').find('input').val(), $(this).val());
    typeval =  $(this).val();
    clientval = $(this).parents('tr').find('input').val();
});​
  • $(this).parents('tr').find('input').val();//client_idを提供します
  • $(this).val();//選択したアイテムの値を表示します

次に、これらの値をAJAX呼び出しにドロップするだけです。

jsFiddleの例

于 2012-09-07T17:15:17.423 に答える
0

Jamesのソリューションを使用すると、次のようになります。

その場合、jqueryは次のようになります。

var motion = this.value var client_id = this.parent（）。find（ "。clientval"）

于 2012-09-07T17:17:30.240 に答える
0

phpを使用して、select要素とinput要素に一意のIDを指定します。何かのようなもの：

<input type="hidden" id="client_id$client_id" ...

<select name="movement[]" id="mov$client_id" ...

次に、javascript関数でphpを使用して、次のようにclient_idを含めます。

changeMovement(client_id)

次に、client_idを使用して、次のように対応する動きを変更できます。

var client = $("#client_id"+client_id).val();
var movement = $("#mov"+client_id).val();

一意のIDの場合、各行の非表示の入力の値フィールドに入力されている変数を使用することをお勧めします。私はそれらの数字がどこから来ているのか正確に知らずに言っています。

于 2012-09-07T17:01:12.077 に答える
0

この作業例を確認してください 。http：//jsfiddle.net/sushanth009/BZ5Wt/

この行を使用して、選択した行のClientIdを取得できます。

var client = $(this).parent().parent().find('.clientval').val();
于 2012-09-07T17:18:10.067 に答える
0

さて、あなたは次のことをする必要があります：

1.すべてを削除onchange='changeMovement()'します。もう必要ありません。

2.PHPechoからだけclass_id。

3.以下のように取得する方法を修正しclient_idます。

コード：

$(document).ready(function() {

    $('.typeval').change(function() {
        var movement = $(this).val();
        var client_id = $(this).parent().siblings().find('.clientval').val();
        var class_id = <?php echo $class_id; ?>;

        /* Do your AJAX call here */
    });

});​​​​​​​​​​​​
于 2012-09-07T17:27:45.363 に答える