Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.01.2015, 18:45
Новичок на форуме
Отправить личное сообщение для TheAthlete Посмотреть профиль Найти все сообщения от TheAthlete
 
Регистрация: 18.01.2014
Сообщений: 3

Не отправляется POST-запрос
Здравствуйте!
Изучаю jQuery по книге "Адам Фримен - jQuery для профессионалов (Expert's Voice) - 2013", Разбираю код реагирования на изменения значений формы:

<!DOCTYPE html>
<html>
<head>
    <title>Example</title>
    <script src="jquery-1.7.js" type="text/javascript"></script>
    <script src="jquery.tmpl.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="styles.css"/>
    <script type="text/javascript">
        $(document).ready(function() {
            var data = [
               { name: "Astor", product: "astor", stocklevel: "10", price: "2.99"},
               { name: "Daffodil", product: "daffodil", stocklevel: "12", price: "1.99"},
               { name: "Rose", product: "rose", stocklevel: "2", price: "4.99"},
               { name: "Peony", product: "peony", stocklevel: "0", price: "1.50"},
               { name: "Primula", product: "primula", stocklevel: "1", price: "3.12"},
               { name: "Snowdrop", product: "snowdrop", stocklevel: "15", price: "0.99"},
            ];
  
            var templResult = $('#flowerTmpl').tmpl(data);
            templResult.slice(0, 3).appendTo('#row1');
            templResult.slice(3).appendTo("#row2");
                
            $('input').focus(handleFormFocus).blur(handleFormFocus);
         
            function handleFormFocus(e) {
                var borderVal = e.type == "focus" ? "medium solid green" : "";
                $(this).css("border", borderVal);
            }     
  
            var total = $('#buttonDiv')
                .prepend("<div>Total Items: <span id=total>0</span></div>")
                .css({clear: "both", padding: "5px"});
            $('<div id=bbox />').appendTo("body").append(total).css("clear: left");
                
            $('input').change(function(e) {
                var total = 0;
                $('input').each(function(index, elem) {
                    total += Number($(elem).val());
                });            
                $('#total').text(total);
            });     
        });
  </script>
    <script id="flowerTmpl" type="text/x-jquery-tmpl">
        <div class="dcell">    
            <img src="${product}.png"/>
            <label for="${product}">${name}: </label>
            <input name="${product}" value="0" required />
        </div>
    </script>
</head>
<body>
    <h1>Jacqui's Flower Shop</h1>
    <form method="post" action="http://node.jacquisflowershop.com/order">
        <div id="oblock">        
            <div class="dtable">
                <div id="row1" class="drow">
                </div>
                <div id="row2"class="drow">
                </div>            
            </div>
        </div>
        <div id="buttonDiv"><button type="submit">Place Order</button></div>                    
    </form>
</body>
</html>


Если нажать на submit, то ничего не происходет. Если закомментировать код

var total = $('#buttonDiv')
                .prepend("<div>Total Items: <span id=total>0</span></div>")
                .css({clear: "both", padding: "5px"});
            $('<div id=bbox />').appendTo("body").append(total).css("clear: left");
                
            $('input').change(function(e) {
                var total = 0;
                $('input').each(function(index, elem) {
                    total += Number($(elem).val());
                });            
                $('#total').text(total);
            });

то отправка происходит.
Подскажите пожалуйста, в чем может быть проблема?
Ответить с цитированием
  #2 (permalink)  
Старый 28.01.2015, 19:45
Новичок на форуме
Отправить личное сообщение для TheAthlete Посмотреть профиль Найти все сообщения от TheAthlete
 
Регистрация: 18.01.2014
Сообщений: 3

Проблему решил: суть проблемы в том, что div id=bbox захватывает кнопку, в результе submit находится вне формы. Нужно поменять appendTo("body") на appendTo("form"):

$('<div id=bbox />').appendTo("body").append(total).css("clear: left");

на
$('<div id=bbox />').appendTo("form").append(total).css("clear: left");
Ответить с цитированием
  #3 (permalink)  
Старый 28.01.2015, 23:40
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от TheAthlete
jQuery для профессионалов
Эти два слова не могут стоять рядом, ну никак ))
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
POST запрос не отправляется Jmunb AJAX и COMET 1 26.11.2011 16:03
проблемка с объектом, POST запрос Ajax zercs jQuery 1 24.04.2011 19:06
POST запрос воспринимается как OPTIONS neshta AJAX и COMET 0 29.03.2011 23:34
post запрос! ybiza AJAX и COMET 1 11.02.2011 09:41
Yahoo UI асинхронный POST запрос lisan AJAX и COMET 1 12.02.2010 13:57