0

ユーザーがテーブルに行を追加できるページがあります。1) 3 つの入力フィールドにテキストを追加し、2) ボタンをクリックします。

テーブルに行を追加する前に、同じレコードがまだないことを確認したい....

レコードを追加するためのコードは次のとおりです。

    $("#add_to_table").click(function()   {

            var contact_type=$("#contact_types option:selected").val();
            var call_order = $('#call_order').val();
            var contact_details = $('#contact_details').val();

            // add new logic here

            var rules_count = $('#rule_summary tbody tr').length - 1;  //minus one for the
            rules_count = rules_count + 1;

            var htmlstring = '<tr id="rule_' + rules_count + '">'
            htmlstring = htmlstring + '<td><input type="button" value="Remove" class="removeruleset"/></td>'
            htmlstring = htmlstring + '<td>' + contact_type + '</td>'
            htmlstring = htmlstring + '<td id=' + contact_details + '-' + rules_count + '>' + contact_details + '</td>'
            htmlstring = htmlstring + '<td>' + call_order + '</td>'
            htmlstring = htmlstring + '</tr>'
            htmlstring = htmlstring + '<tr><input type="hidden" name="contact_type"' + rules_count + ' value=' + contact_type  + '/></tr>'
            htmlstring = htmlstring + '<tr><input type="hidden" name="contact_details"' + rules_count + ' value=' + contact_details + '/></tr>'
            htmlstring = htmlstring + '<tr><input type="hidden" name="contact_details"' + rules_count + ' value=' + call_order + '/></tr>'
            $('#rule_summary tr:last').after(htmlstring);
    });

このコードは機能していますが、改善する方法があると確信しています。私はまだ jQuery と Javascript に慣れていません。

コードを変更するためにこれまでに思いついたのは次のとおりです: (「ここに新しいロジックを追加する」というコメントがある場所にこれを挿入します。

var cell;
var result = $('#rule_summary tr').find('td:contains('+contact_details+')');

result.siblings().css('背景色', '赤');

基本的に、行の最初のセルと最後のセルが、入力フィールドから取得した値と一致するかどうかを確認する必要があります。隣接するセルを色分けすることで、コードが正しいセルを見つけていることを確認しました。各兄弟の値を抽出する方法を知る必要があるだけです...一度に1つずつ。

編集1

また、テーブルのフィールドにクラスを追加し、クラス名で兄弟を選択しようとしました:

var cell;
var result = $('#rule_summary tr').find('td:contains('+contact_details+')');
result.siblings().css('background-color', 'red');

alert(result.siblings('td.call_order').val());

しかし、アラートは何も返されません。

4

2 に答える 2

1

これは、あなたの望むことですか？

If $('#rule_summary tr > td:contains('+contact_details+')').length {
    //theres a duplicate entry
}
else {
    //add new entry
}

EDIT 1 それぞれの内部のテキストを取得するには:

result.siblings().each(function(){
    alert(this.html());
});

編集2

特定のものを取得するには：

result.siblings(".yourId").html();
于 2013-06-18T19:39:01.093 に答える
1

これが私が思いついた解決策です：

            var result = $('#rule_summary tr').find('td:contains('+contact_details+')'); //find cell in table with same contact_details information... 

                if (result.length > 0 ) {
                    if (result.siblings("#call_order").html() == call_order && result.siblings("#contact_type").html() == contact_type){
                        alert("Duplicate!");
                        return false;
                    }
                }
于 2013-06-18T20:40:18.203 に答える