1

サービスからjsonデータを取得するjqGridがあります。編集モードのときに、ラジオ ボタンを列に追加する必要があります。これはインライン編集である必要があります。バッチでレコードを更新する必要があります。selectRowjqGrid でラジオ ボタンを表示するカスタム要素とカスタム値を作成しました。私が抱えている問題は、選択したラジオ ボタンの値を取得できないことです。代わりに、常に最初のラジオ ボタンの値を返します。コードはリンクにあります

以下は、カスタム要素を作成するコードです

function radioelem(value, options) {
    var receivedradio = '<input type="radio" name="receivednaradio" value="R"';
    var breakline = '/>Received<br>';
    var naradio = '<input type="radio" name="receivednaradio" value="N"';
    var endnaradio = '/>NA<br>';
    if (value == 'Received') {
        var radiohtml = receivedradio + ' checked="checked"' + breakline + naradio + endnaradio;
        return radiohtml;
    }
    else if (value == 'NA') {
        var radiohtml = receivedradio + breakline + naradio + ' checked="checked"' + endnaradio;
        return radiohtml;
    }
    else {
        return receivedradio + breakline + naradio + endnaradio;
    }
};

function radiovalue(elem, operation, value) {
    if (operation === 'get') {
        return $(elem).val();
    } else if (operation === 'set') {
        if ($(elem).is(':checked') === false) {
            $(elem).filter('[value=' + value + ']').attr('checked', true);
        }
    }
};
4

1 に答える 1

0

コードの主な問題は、custom_element(関数) の実装が1 つの要素radioelemではない HTML フラグメントを返すことです。戻り値radioelem

<input type="radio" ... value="R"/><input type="radio" ... value="R"/>

文字列として。2 つの入力要素から構成されます。この場合、カスタム コントロールは失敗しました。jqGrid がどのように使用するかコードを調べると、問題を理解できるようになります。次のように単純化された形式で書き直した jqGrid コードの行を見てください。

var celm = options.custom_element.call($t,vl,options);
if(celm) {
    celm = $(celm).addClass("customelement").attr({id:options.id,name:options.name});
    $(elem).empty().append(celm);
}

jqGrid は$(celm)where celmis 関数から返される文字列を使用しcustom_elementます。あなたの場合、 2 つの要素$(celm)の jQuery ラッパーになります。つまり。そのため、 1 つのカスタム要素にクラス "customelement" を設定する代わりに、コードはクラス "customelement" を両方の要素に追加します。次の呼び出し ( の呼び出し)では、両方の要素に同じ値が設定されます。ID は一意である必要がありますが、コードでは重複が生成されます。 <input>$(celm) === 2$(celm).addClass("customelement") <input>attr id <input>id

custom_element（関数）の正確な実装であるにはradioelem、さらに複雑な HTML フラグメントを返します

<input type="radio" ... value="R"/><br/><input type="radio" ... value="R"/><br/>

HTML フラグメントから最後に jqGrid を生成するコードを調べると、以下のような非常に面白くて非常に間違った HTML フラグメントが表示されます。

<input name="NA" class="customelement" id="2_NA" type="radio" value="R">
Received
<br class="customelement" id="2_NA" name="NA">
<input name="NA" class="customelement" id="2_NA" type="radio" value="N">
NA
<br class="customelement" id="2_NA" name="NA">

<br/>おそらく、これほど奇妙な要素は今まで見たことがないでしょう。コード フラグメントには、同じ を持つ 4 つの要素が含まれていることがわかりますid="2_NA"。その後、カスタム コントロールが期待どおりに動作しないことに驚かないでください。

問題を解決するには、前に返されたコードを の内部<span>...</span>または内部に配置するだけです<div>...</div>:

function radioelem(value, options) {
    var receivedradio = '<input type="radio" name="receivednaradio" value="R"',
        breakline = '/>Received<br>',
        naradio = '<input type="radio" name="receivednaradio" value="N"',
        endnaradio = '/>NA<br>';

    if (value === 'Received') {
        return "<span>" + receivedradio + ' checked="checked"' + breakline + naradio + endnaradio + "</span>";
    }
    if (value === 'NA') {
        return "<span>" + receivedradio + breakline + naradio + ' checked="checked"' + endnaradio + "</span>";
    }
    return "<span>" + receivedradio + breakline + naradio + endnaradio + "</span>";
}
于 2013-03-30T20:16:47.207 に答える