Получить значения из нескольких форм с JQuery не работает должным образом

0

Посмотрите мой код со скрипки:

$(document).ready(function(){
    $('.forms').submit(function(){
        var name = $('.when', this).attr('name');
        var value = $('.when', this).val();
        alert('the name is:' + name + ' and the value is ' + value);
        return false;
    });
});

И таблица:

<table align="center" class='hovertable' width="90%">
    <tr>
        <th colspan="5">Home Gas</th>
    </tr>
    <tr>
        <th>Timestamp</th>
        <th>Image</th>
        <th>Use to train</th>
        <th>Validated</th>
        <th>Action</th>
    </tr>
    <form id='0' class='forms' name='input[0]' action='correct_exec.php' method='GET'>
        <input id='' class='rpiid' type='hidden' name='rpiid[0]' value='00000000c83de86' />
        <input id='' class='sensor_id' type='hidden' name='sensor_id[0]' value='1' />
        <input id='' class='when' type='hidden' name='when[0]' value='2014-02-24 05:00:03' />
        <tr>
            <td align='center'>2014-02-24
                <BR />05:00:03</td>
            <td>
                <input id='' class='val_displayed' type='text' name='val[0]' value='0366167' />
            </td>
            <td>
                <input id='' class='train' type='hidden' name='train[0]' value='False' />
                <input id='' class='train' type='checkbox' name='train[0]' value='True' />
            </td>
            <td>
                <input id='' class='valid' type='hidden' name='valid[0]' value='False' />
                <input id='' class='valid' type='checkbox' name='valid[0]' value='True' />
            </td>
            <td>
                <button id='0' class='submit_button' type='submit' name='button' value='update'>update</button>
            </td>
        </tr>
    </form>
    <form id='1' class='forms' name='input[1]' action='correct_exec.php' method='GET'>
        <input id='' class='rpiid' type='hidden' name='rpiid[1]' value='00000000c83de86' />
        <input id='' class='sensor_id' type='hidden' name='sensor_id[1]' value='1' />
        <input id='' class='when' type='hidden' name='when[1]' value='2014-02-24 04:00:03' />
        <tr>
            <td align='center'>2014-02-24
                <BR />04:00:03</td>
            <td>
                <input id='' class='val_displayed' type='text' name='val[1]' value='0366132' />
            </td>
            <td>
                <input id='' class='train' type='hidden' name='train[1]' value='False' />
                <input id='' class='train' type='checkbox' name='train[1]' value='True' />
            </td>
            <td>
                <input id='' class='valid' type='hidden' name='valid[1]' value='False' />
                <input id='' class='valid' type='checkbox' name='valid[1]' value='True' />
            </td>
            <td>
                <button id='1' class='submit_button' type='submit' name='button' value='update'>update</button>
            </td>
        </tr>
    </form>
</table>

http://jsfiddle.net/starcraft04/BLCJ5/5/

Я получаю всегда имя результата undefined и значение undefined.

Что не так с моим кодом javascript?

Спасибо за помощь.

  • 0
    Смотри эту скрипку . Первая кнопка работает, вторая нет. Проблема с вашей разметкой - table > form > tr является недействительным HTML.
  • 0
    хорошо, тогда вы можете показать мне решение? Я думаю, я не первый, кто пытается обновить таблицу с несколькими строками ...
Показать ещё 7 комментариев
Теги:

1 ответ

1
Лучший ответ

Ваш html не отображается правильно. Поскольку вы используете форму в tr, и вы используете tr внутри tr. Попробуй это:

Код HTML:

<table align="center" class='hovertable' width="90%">
    <tr>
        <th colspan="5">Home Gas</th>
    </tr>
    <tr>
        <th>Timestamp</th>
        <th>Image</th>
        <th>Use to train</th>
        <th>Validated</th>
        <th>Action</th>
    </tr>
    <tr id='0' class='forms' name='input[0]' action='correct_exec.php' method='GET'>
        <input id='' class='rpiid' type='hidden' name='rpiid[0]' value='00000000c83de86' />
        <input id='' class='sensor_id' type='hidden' name='sensor_id[0]' value='1' />
        <input id='' class='when' type='hidden' name='when[0]' value='2014-02-24 05:00:03' />
            <td align='center'>2014-02-24
                <BR />05:00:03</td>
            <td>
                <input id='' class='val_displayed' type='text' name='val[0]' value='0366167' />
            </td>
            <td>
                <input id='' class='train' type='hidden' name='train[0]' value='False' />
                <input id='' class='train' type='checkbox' name='train[0]' value='True' />
            </td>
            <td>
                <input id='' class='valid' type='hidden' name='valid[0]' value='False' />
                <input id='' class='valid' type='checkbox' name='valid[0]' value='True' />
            </td>
            <td>
                <input id='0' class='submit_button' type='button' name='button' value='update'/>
            </td>
        </tr>
    <tr id='1' class='forms' name='input[1]' action='correct_exec.php' method='GET'>
        <input id='' class='rpiid' type='hidden' name='rpiid[1]' value='00000000c83de86' />
        <input id='' class='sensor_id' type='hidden' name='sensor_id[1]' value='1' />
        <input id='' class='when' type='hidden' name='when[1]' value='2014-02-24 04:00:03' />
            <td align='center'>2014-02-24
                <BR />04:00:03</td>
            <td>
                <input id='' class='val_displayed' type='text' name='val[1]' value='0366132' />
            </td>
            <td>
                <input id='' class='train' type='hidden' name='train[1]' value='False' />
                <input id='' class='train' type='checkbox' name='train[1]' value='True' />
            </td>
            <td>
                <input id='' class='valid' type='hidden' name='valid[1]' value='False' />
                <input id='' class='valid' type='checkbox' name='valid[1]' value='True' />
            </td>
            <td>
                <input id='1' class='submit_button' type='button' name='button' value='update'/>
            </td>
        </tr>
</table>

Код jQuery:

$(document).ready(function(){
    $('.submit_button').click(function(){
        var name = $(this).parents('tr.forms').find('.when').attr('name');
        var value = $(this).parents('tr.forms').find('.when').val();
        alert('the name is:' + name + ' and the value is ' + value);
        return false;
    });
});

DEMO

Ещё вопросы

Сообщество Overcoder
Наверх
Меню