3

あるページでは、ajax を使用して既存の値を編集しようとしています。jQuery Inline Editを使用して新しいデータを投稿し、レコードを更新して成功を返すことでこれを行っています。

これはうまくいっています。

次に、新しいレコードを追加する機能を実装しました。これを行うために、テーブルの最後にフォームがあり、投稿データを送信して元のページにリダイレクトします。

それぞれが個別に機能しますが、フォームを使用して新しいレコードを追加した後、インライン編集が機能しなくなります。Web ページを閉じて再度開くと、フォームを使用して再びレールから外れるまで、正常に機能します。

セッションデータをクリアし、フォームに別の名前を付け、別のページにリダイレクトするなど、いくつかのソリューションを試しました（これは機能しますが、フォームを元の場所にリダイレクトしたいので理想的ではありません）。

ビュー フォーム データのサンプルを次に示します。

<?php foreach($week->incomes as $income):?>
    <tr>
        <td><?php echo $income->name;?></td>
        <td width="70" style="text-align:right;" class="editableSingle income id<?php echo $income->id;?>">$<?php echo $income->cost;?></td>
    </tr>
<?php endforeach;?>
    <?php echo form_open('budget/add/'.$week->id.'/income/index', 'class="form-vertical" id="add_income"'); ?>
    <tr>
        <td>
            <input type="text" name="name" class="input-small" placeholder="Name">
            <input type="text" name="cost" class="input-small" placeholder="Cost">
        </td>
        <td>

            <button type="submit" class="btn btn-small pull-right"><i class="icon-plus "></i></button>
        </td>
    </tr>
    <?php echo form_close(); ?>

これは JavaScript の初期化コードです。

$(function(){
$.inlineEdit({
    income: 'budget/update_income/',
    expense: 'budget/update_expense/'
}, 
{
    animate: false,
    filterElementValue: function($o){

        if ($o.hasClass('income')) {
            return $o.html().match(/\$(.+)/)[1];
        }
        else if ($o.hasClass('expense')) {
            return $o.html().match(/\$(.+)/)[1];
        }
        else {
            return $o.html();
        }
    }, 
    afterSave: function(o){
        if (o.type == 'income') {
            $('.income.id' + o.id).prepend('$');
        }
        if (o.type == 'expense') {
            $('.expense.id' + o.id).prepend('$');
        }
    },
    colors: { error:'green' }
});
});

私が試みたことなどを明確にするために、さらに情報を提供できる場合は、お知らせください。

一時的な修正

問題の原因がまだわからないため、理想的ではありません。

リダイレクトというメソッドを作成しました。

public function redirect(){
    redirect('');
}

フォームの送信後にそれを呼び出しているため、複数の投稿の送信が一時的に機能します。

4

2 に答える 2

0

フォームをテーブルタグ内に配置すると、jqueryが機能しないとどこかで聞いたことがあります。次のようにテーブルの外にある必要があります。

<form>
<table>
...
</table>
</form>

ajaxロード時にテーブル要素内にある場合、jQueryはフォーム要素のコンテンツを取得しません

それをテストした後、私はそれが部分的に真実であることを発見しました（別名信頼性が低い）...それが私がテーブルの使用をやめた理由です。

于 2012-10-19T08:09:54.670 に答える
0

jquery記号を置き換えて試してみてください。

$はjQueryに置き換える必要があり、正常に動作する新しいインスタンスが作成されます

于 2012-09-21T12:56:19.897 に答える