Автоматическая отправка формы и получение данных формы с использованием javascript / jquery - PullRequest
1 голос
/ 05 марта 2011

Я пытаюсь создать форму, которая использует переключатели, но как только кнопка переключается, она запускает функцию JavaScript, которая извлекает данные из формы, вызывающей скрытые значения.

Я подумал, что долженбыть примерно таким, но мне не повезло

<script type="text/javascript">
    $(function submitFunction(formname) {
        $(".submit").onclick(function(formname) {
               var hiddenValue = document.formname.hidden_value.value;
               var vote = document.formname.vote.value;
               var dataString = 'vote=' + vote + 'hiddenValue=' + hiddenValue;

               alert(dataString);
        });
    });
</script>

<form action="post"  name="form1" >
    <input type=hidden name='hidden_value' value='12345'>
    <input type='radio' name='vote' value='yes' onclick='submitFunction(form1)';>Yes <br/>
    <input type='radio' name='vote' value='no' onclick='submitFunction(form1)';>No
</form>

Редактировать: После некоторой помощи из ответа здесь у меня есть новый код.Он отлично работал на jsFiddle, но не повезло, когда я сам его реализовал.Я убедился, что jQuery загружается правильно, и это версия 1.51.Вот кодЕще раз спасибо заранее.

JavaScript:

     if(jQuery){
         alert("jQuery Here");
     }

    $("input.liveRadio1").click(function() {
        var jThis = $(this);

        var hiddenValue = jThis.siblings('input[name="hidden_value"]').val();
        var vote = jThis.val();
        var dataString = 'vote=' + vote + 'hiddenValue=' + hiddenValue;

        alert(dataString);
    });

HTML:

    <form action="post"  name="form1" >
        <input type=hidden name='hidden_value' value='12345' />
        <input class="liveRadio1" type='radio' name='vote' value='yes' />Yes <br/>
        <input class="liveRadio1" type='radio' name='vote' value='no' />No
    </form>

Ответы [ 3 ]

2 голосов
/ 05 марта 2011

Сохраняйте это простым;Не используйте onclick, и вам не нужно submitFunction для размещенного кода.
Это должно работать:
Смотрите его в действии на jsFiddle .

<script type="text/javascript" >
    $("input.liveRadio1").click (function () {
        var jThis       = $(this);
        var hiddenValue = jThis.siblings ('input[name="hidden_value"]').val ();
        var vote        = jThis.val ();
        var dataString  = 'vote=' + vote + 'hiddenValue=' + hiddenValue;

        alert(dataString);
    });
</script>

<form action="post"  name="form1" >
    <input type=hidden name='hidden_value' value='12345'>
    <input class="liveRadio1" type='radio' name='vote' value='yes'>Yes <br/>
    <input class="liveRadio1" type='radio' name='vote' value='no'>No
</form>



Дополнительный ответ на пересмотренный вопрос:

Код не работает в автономном файле, поскольку не было достаточно временидля jQuery и DOM для инициализации.

Стандартный способ сделать это - использовать событие ready.Вот так:

<script type="text/javascript">
    function jQueryMain ()
    {
        $("input.liveRadio1").click(function() {
            var jThis       = $(this);
            var hiddenValue = jThis.siblings('input[name="hidden_value"]').val();
            var vote        = jThis.val();
            var dataString  = 'vote= ' + vote + ', hiddenValue= ' + hiddenValue;

            alert(dataString);
        });
    }

    $(document).ready (jQueryMain);
</script>
0 голосов
/ 05 марта 2011

проблема в том, как вы создаете свою функцию, правильное значение должно быть

<script type="text/javascript" >
    function submitFunction(formname) {
        $('#' + formname).submit();
    }
</script>

<form action="post" id="form1" >
    <input type=hidden name='hidden_value' value='12345'>
    <input type='radio' name='vote' value='yes' onclick='submitFunction('form1')';>Yes <br/>
    <input type='radio' name='vote' value='no' onclick='submitFunction('form1')';>No
</form>
0 голосов
/ 05 марта 2011

Вам не нужно передавать форму form1 в

onclick='submitFunction(form1)';

, потому что вы обращаетесь к ней в подтверждении.Хотя я думаю, что использование этой функции отправки в другой функции может испортить ее, потому что когда вы нажимаете переключатель, вы не нажимаете кнопку отправки, поэтому эта функция в submitFunction никогда не сработает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...