Форма JavaScript - обход поведения по умолчанию для AJAX - PullRequest
Новая
       8

Форма JavaScript - обход поведения по умолчанию для AJAX

1 голос
/ 19 марта 2009

Я пытаюсь использовать следующий код ниже. То, что я хочу, - это получить значение выбранной радиокнопки и отправить обратно в метод javascript. Кажется, любой вариант, который я пробую, терпит неудачу. 

<html>
  <head>
    <style type="text/css">
      body { background-color: black; color: white; }
    </style>
    <script type="text/javascript">
      function handleClick(event)
      {

        alert(this.textBox1.value);

        event.preventDefault(); // disable normal form submit behavior
        return false; // prevent further bubbling of event
      }

    </script>
  </head>
  <body">
    <form name="myform">
      <div>
 <input type="radio" name="test1" value="Cheese">
 <input type="radio" name="test2" value="Grapes">
 <input type="radio" name="test3" value="Crackers">
      </div>
      <input type="submit" onsubmit=JavaScript:handleClick(value) value="Update"/>
    </form>
  </body>
</html>

Ответы [ 3 ]

2 голосов
/ 31 июля 2009

Ваш код вырезан, но я думаю, что вы хотите сделать что-то вроде этого: 

<html>
<head>
    <script type="text/javascript">
        function alertThing() {
            alert(document.getElementsByName('textBox1')[0].value);
            return false;
        }
    </script>
</head>
<body>
    <form action="myPage.php" method="post" onsubmit="return alertThing();">
        <input type="text" name="textBox1" value="hello" />
        <input type="submit" value="Submit the form!" />
    </form>
</body>
</html>

Это предупредит значение, но не отправит форму. Надеюсь, я тебе помог!

// Линус Уннебек

0 голосов
/ 20 марта 2009

Если бы это был я, я бы использовал фреймворк, такой как JQUERY. Все переключатели, соответствующие селектору «ввод формы: радио» (и вы можете быть очень точными с селекторами), будут связаны с функцией doThis. Я сделал doThis отдельную функцию, но это было только для ясности.

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

<html>
<body>
    <form>
      IAMFOO <input type="radio" name="foobar" value="foo"/>
      IAMBAR <input type="radio" name="foobar" value="bar"/>
    </form>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
   function dothis() {
    alert(this.value);
  }
  $(document).ready(function(){
    $("form input:radio").click(dothis)
  });
</script>

</body>
</html>
0 голосов
/ 19 марта 2009

Если вы говорите о том же общем коде, который вы выложили в ваш другой вопрос , я полагаю, что вы должны пройти через возможные радиокнопки; нет встроенной функции whichRadioButtonIsSelected ().

Вы можете сделать что-то вроде этого: 

function getRadioButtonValue(rbutton)
{
  for (var i = 0; i < rbutton.length; ++i)
  { 
    if (rbutton[i].checked)
      return rbutton.value;
  }
  return null;
}

// then in your code, where "this" is the form object, and 
var rbvalue = getRadioButtonValue(this.radiobutton);
// replace "radiobutton" with whatever the radiobutton group's name is

edit: вот пример: 

<html>
  <head>
    <style type="text/css">
      body { background-color: black; color: white; }
    </style>
    <script type="text/javascript">
      function getRadioButtonValue(rbutton)
      {
        for (var i = 0; i < rbutton.length; ++i)
        { 
          if (rbutton[i].checked)
            return rbutton[i].value;
        }
        return null;
      }

      function handleClick(event)
      {
        if (console) console.info("handling click");  
        // for Firebug debugging, if you want it

    /* do something here */
        alert(this.textBox1.value);
        alert("Favorite weird creature: "+getRadioButtonValue(this["whichThing"]));
        // I don't like alerts but it works everywhere

        if (console) console.info("handled click");  

        event.preventDefault(); // disable normal form submit behavior
        return false; // prevent further bubbling of event
      }
      function doit()
      {
        if (console) console.info("starting doit()");
        document.forms.myform.addEventListener("submit", handleClick, true);
        return true;
      }
    </script>
  </head>
  <body onload="doit()">
    <form name="myform">
      <div>
          <textarea name="textBox1" rows="10" cols="80">
'Twas brillig, and the slithy toves
Did gyre and gimble in the wabe;
All mimsy were the borogoves,
And the mome raths outgrabe.
         </textarea>
      </div>
      <input type="submit" value="Update"/>
      Which of the following do you like best?
      <p><input type="radio" name="whichThing" value="slithy toves" />Slithy toves</p>
      <p><input type="radio" name="whichThing" value="borogoves" />Borogoves</p>
      <p><input type="radio" name="whichThing" value="mome raths" />Mome raths</p>
    </form>
  </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...