Автор Тема: събмит метод в джаваскрипт (Прочетена 4523 пъти)

theSit · « -: 14 Ноември 2014, 15:04:31 »

Здравейте. Не мога да разбера какъв е смисъла да има този метод при положение, че формата се събмитва и без него. Това е код взет w3school.

Код: Javascript

<?php if(!empty($_GET['fname'])) var_dump($_GET); ?>
<!DOCTYPE html>
<html>
<body>
 
<p>Enter some text in the fields below, then press the "Submit form" button to submit the form.</p>
 
<form id="myForm" action="">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <button type="button" onclick="myFunction()">Click Me!</button> 
</form>
 
<script>
function myFunction() {
 
    document.getElementById("myForm").submit(); 
}
</script>
 
</body>
</html>
 

Avalanche

Ако изкараш бутона извън формата ще има повече смисъл

theSit

Цитат на: Avalanche в 14 Ноември 2014, 16:59:39

Ако изкараш бутона извън формата ще има повече смисъл

Защото е бутон елемент ли?

Avalanche

Тоя конкретно бутон не съм сигурен дали ще прати формата, но обикновено го прави submit бутона вътре в самата формата. Идеята на тази функция е да се използва друг елемент за пращане на формата, на практика можеш да го направиш при цъкане върху body тага да се праща форма с id myForm.

HanKrum

Код: HTML

<button> ......
<input type="button" ...
<input type = "submit"

...ако са във форма при клик ще събмитнат!

theSit

Значи типа на елемента трябва да е "submit" за да може да се изпрати формуляра, така ли? Ако ли не, мога да ползвам javascript submit method за целта. Имам и още един въпрос.Защо се игнорира "return false" в следната ситуация,

Код: PHP

<?php if(!empty($_GET['fname'])) var_dump($_GET); ?>
<!DOCTYPE html>
<html>
<body>
 
<p>Enter some text in the fields below, then press the "Submit form" button to submit the form.</p>
 
<form id="myForm" action="">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <button type="submit" onclick="myFunction()">Click Me!</button> 
</form>
 
<script>
function myFunction() {
return false;
    document.getElementById("myForm").submit(); 
}
</script>
 
</body>
</html>
 

Avalanche

Не, типа на button/input трябва да е submit за да прати форма. Return false се игнорира щото формата и без javascript се праща. Ако имаше друг елемент, който да праща формата вече return-а щеше да спира изпълнението на код.

Код: Javascript

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script>
    function myFunction() {
        // return false;
        document.getElementById("myForm").submit();
    }
    </script>
</head>
<body>
    <form id="myForm" action="">
      First name: <input type="text" name="fname"><br>
      Last name: <input type="text" name="lname"><br><br>
      <span onclick="myFunction()">submit button</span>
        <!-- <button type="button" onclick="myFunction()">Click Me!</button>  -->
    </form>
</body>
</html>

HanKrum

Цитат на: theSit в 15 Ноември 2014, 11:55:31

Значи типа на елемента трябва да е "submit" за да може да се изпрати формуляра, така ли? Ако ли не, мога да ползвам javascript submit method за целта. Имам и още един въпрос.Защо се игнорира "return false" в следната ситуация,
...

@TheSit, явно не прочиташ всички постове!

Цитат на: HanKrum в 15 Ноември 2014, 09:37:05

Код: HTML
<button> ......
<input type="button" ...
<input type = "submit"
...ако са във форма при клик ще събмитнат!

theSit

Цитат

@TheSit, явно не прочиташ всички постове!

Напротив, това не работи при мен -

Код: PHP

<form id="myForm" action="">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <button type="button" onclick="myFunction()">Click Me!</button> 
</form>
 

И това -

Код: PHP

<form id="myForm" action="">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <input type="button" value="submitMe"/> 
</form>
 

@Аваланш да разбирам, че има приоритети ли?

Avalanche

Ми не бих го нарекъл приоритет, JavaScript-а се изпълнява - ако добавиш още код към функцията и той ще се прати. В случая е по-интересно спирането на изпъление на код. Както видя с return false няма да стане, защото формата е казано че ще се прати още в HTML-а, тоя return спира само изпълнението на javascript-а и ускорява пращането на формата. Има метод preventDefault, който в случая ще направи това, което искаш да направи return false, но той се слага върху event, ето и пример (на базата на документацията от мозила):

Код: Javascript

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <form id="myForm" action="">
        First name: <input type="text" name="fname"><br>
        Last name: <input type="text" name="lname"><br><br>
        <button type="submit">Click Me!</button> 
    </form>
    <script>
    function myFunction() {
        document.getElementById("myForm").submit();
    }
    document.getElementById('myForm').addEventListener(
        'submit', function(event) {
            event.preventDefault();
        }
    );
    </script>
</body>
</html>

HanKrum

Код: HTML

<form id="myForm">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <button>Click Me!</button>
</form>

Ами така? http://jsfiddle.net/ce9hhbw9/1/

!!! тага button няма атрибут type="button"!!!

theSit

Цитат на: HanKrum в 15 Ноември 2014, 13:00:24

Код: HTML
<form id="myForm">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br><br>
<button>Click Me!</button>
</form>
Ами така? http://jsfiddle.net/ce9hhbw9/1/

!!! тага button няма атрибут type="button"!!!

Няма разлика

От предложениете варианти, при мен работи само когато бутона е със " submit" тип.

Аваланш, този preventDefault() под всички ли браузъри ще работи?

Avalanche

Много хубав въпрос, най-вероятно не (не се крий IE, за теб говоря). Гледам че в по-старите версии на IE номера става с returnValue.

Новини:

Автор Тема: събмит метод в джаваскрипт (Прочетена 4523 пъти)

theSit

събмит метод в джаваскрипт

Avalanche

Re: събмит метод в джаваскрипт

theSit

Re: събмит метод в джаваскрипт

Avalanche

Re: събмит метод в джаваскрипт

HanKrum

Re: събмит метод в джаваскрипт

theSit

Re: събмит метод в джаваскрипт

Avalanche

Re: събмит метод в джаваскрипт

HanKrum

Re: събмит метод в джаваскрипт

theSit

Re: събмит метод в джаваскрипт

Avalanche

Re: събмит метод в джаваскрипт

HanKrum

Re: събмит метод в джаваскрипт

theSit

Re: събмит метод в джаваскрипт

Avalanche

Re: събмит метод в джаваскрипт