popup modal window on input submit

teroristd

Registered
Здравейте, възможно ли е да се направи popup modal window on input submit? Пробвах някакви скриптове но не можах да ги подкарам коректно. Проблема е че при натискане на submit страницата се рефрешва.
 
Това не ми върши работа, защото аз при submit правя запис в базата, а с този код нищо не се записва.
 
Имаш 2 варианта :
1 - да използваш горепосочения код в комбинация с ajax
2 - при submit да пренасочваш към страница, която ти отваря popup прозореца
 
От вариант 2 нямам файда защото така мога и директно с php да си го направя.

А вариант 1 как ще стане :)?

Нека да обясня какво целя за да стане по-ясно. Имам форма в която се избират някакви стойности. При submit се записват стойностите в базата. Искам след това да изскочи прозорче с два линка, примерно "продължете да разглеждате" и "количка".
 
Нещо такова:
[js]$(document).ready(function(){

$('form').on('submit', function(event){

event.preventDefault();

$.post("post-data.php", $(this).serialize()).done(function(){
//display popup
});

});
});[/js]

HTML:
<form method='post'>
	<input type='text' name='a' />
	<input type='text' name='b' />
	<input type='submit' />
</form>

PHP:
$a = $_POST['a'];
$b = $_POST['b'];

// ...
 
За съжаление и по този начин не се получава. Продължава да не записва в базата.
 
Според мен нещо ти бъркаш.
Какви грешки дава ?
Сподели и код, за да може да ти се помогне повече.
 
Провери какво се случва в Developer Tools - в таба Network се записват рекуестите, ако не излиза нищо там вероятно ще видиш проблема в конзолата. Само отвори Developer Tools преди да събмитнеш, за да може да логне рекуеста.

Ако до преди това формата е работила, това би трябвало също да работи:
Код:
    $('form').on('submit', function (e) {

        e.preventDefault();
        var form = $(this);
        $.ajax({
            type: form.attr('method'),
            url: form.attr('action'),
            data: form.serialize(),
            success: function (data) {
                //Показваш модала
                console.log(data);
            },
            error: function (data) {
                console.log(data);
            },
        });
    });
Разбира се трябва да имаш и jQuery. И все пак, за да не гадаем, дай да видим HTML-а на страницата с формата и php-то към което праща
 
Ето какво е положението. Имам модел, контролер и вю.

В модела имам метод който прави записа в базата.
Код:
public function cart($size, $counter)
    {
        $this->_database->prepare('INSERT INTO cart (email,image,sizes,counter) VALUES(?,?,?,?)', array($arr['email'], $img[0]['image'], $size, $counter))->execute();
    }

В контролера викам модела и правя проверки
Код:
        $submit = $this->_normalize->post('submit');
        $size = $this->_normalize->post('size');
        $counter = $this->_normalize->post('counter');

if (isset($submit))
            {
                try
                {
                    $this->_isLoggedModel->isLogged();
                }
                catch (\Throwable $exc)
                {
                    if ($exc->getMessage() != 'logged')
                    {
                        header("Location:" . $this->_link . $this->_data['link_login']);
                    }
                    $this->_offerModel->cart($size, $counter);
                }
            }
            $this->layout();

Във вю-то е формата и джаваскрипта.
Код:
<form method="post">
                    <select name="size">
                        <option value="<?php echo $value['size']; ?>">size</option>
                    </select>

                    <a id="js-minus" class="minus">-</a>
                    <span id="counter">1</span>
                    <a id="js-plus" class="plus">+</a>

                    <input type="hidden" id="inputCounter" value="" name="counter"/>

                    <div id="overlay">
                        <div>
                            <p>Content you want the user to see goes here.</p>
                        </div>
                    </div>

                    <input type="submit" name="submit" value="Add"/>
                </form>

<script type="text/javascript">

    $(document).ready(function(){

        $('form').on('submit', function(event){

            event.preventDefault();

            $.post("http://localhost/market/public/offer/", $(this).serialize()).done(function(){
                el = document.getElementById("overlay");
                el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
            });

        });
    });

</script>

Без event.preventDefault(); формата се субмитва и записа влиза в базата, иначе не. Предполагам може да е заради проверката в контролера if (isset($submit)).
 
На пръв поглед виждам, че променливите $arr и $img в модела не са дефинирани, но щом иначе записва, значи проблема е другаде и трябва да го идентифицираш.
Виж какво се случва в конзолата и network лога, праща ли се рекуест, какъв статус код връща, има ли грешки в response-а. Провери дали не достъпваш сайта през различен хост (например 192.168.0.1) от този към който пращаш рекуеста (localhost) - в такъв случай сесията би се изгубила
 
А то докъде стига точно ajax-а? Я сложи едно echo преди isset проверката, може serialize() да не праща submit бутона и затова да става така
 
Пробвай без тази проверка
PHP:
if (isset($submit)) {}
. Също така този php header няма да ти върши работа в комбинация с ajax. Пробвай така:
PHP:
$size = $this->_normalize->post('size'); 
$counter = $this->_normalize->post('counter'); 

try 
{ 
	$this->_isLoggedModel->isLogged(); 
} 
catch (\Throwable $exc) 
{ 
	if ($exc->getMessage() != 'logged') 
	{ 
		exit('Трябва да си логнат !?'); 
	} 
	$this->_offerModel->cart($size, $counter); 
} 
            
$this->layout();

[js]$(document).ready(function(){

$('form').on('submit', function(event){

event.preventDefault();

$.post("http://localhost/market/public/offer/", $(this).serialize()).done(function(msg){
if(msg.length>0) {
alert(msg);
}
else {
el = document.getElementById("overlay");
el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}
});

});
});[/js]

А още по-добър вариант е да използваш json.
 
В конзолата няма никакви грешки, в network си излиза всичко, преди isset($submit) имам echo, без и със serialize няма разлика.

Това което наблюдавам е че event.preventDefault(); не позволява формата да се субмитне и нормално не прави запис. Ако пък се субмитне страницата се рефрешва и модала изчезва.

Без if (isset($submit)) {} не може защото прави запис при самото влизане на страницата без да е избрано нищо а така не ми върши работа.
 
Реално if (isset($submit)) {} пречи на правилното изпълнение. Ако го махна сработва кода, обаче получавам нежелан запис, при достъпване на страницата или при рефреш. Някакви идеи какво мога да направя?
 
teroristd каза:
Реално if (isset($submit)) {} пречи на правилното изпълнение. Ако го махна сработва кода, обаче получавам нежелан запис, при достъпване на страницата или при рефреш. Някакви идеи какво мога да направя?

1. Как пречи if(isset($submit)) {} на правилното изпълнение.

2. Имаш ли някакъв routing? раздели си методите за post и get. Get като се достъпва страницата. Post. когато събмитваш формата.
 
Fakeheal каза:
teroristd каза:
Реално if (isset($submit)) {} пречи на правилното изпълнение. Ако го махна сработва кода, обаче получавам нежелан запис, при достъпване на страницата или при рефреш. Някакви идеи какво мога да направя?

1. Как пречи if(isset($submit)) {} на правилното изпълнение.

2. Имаш ли някакъв routing? раздели си методите за post и get. Get като се достъпва страницата. Post. когато събмитваш формата.

На първа страница съм пуснал кода който имам.
 
teroristd каза:
Fakeheal каза:
teroristd каза:
Реално if (isset($submit)) {} пречи на правилното изпълнение. Ако го махна сработва кода, обаче получавам нежелан запис, при достъпване на страницата или при рефреш. Някакви идеи какво мога да направя?

1. Как пречи if(isset($submit)) {} на правилното изпълнение.

2. Имаш ли някакъв routing? раздели си методите за post и get. Get като се достъпва страницата. Post. когато събмитваш формата.

На първа страница съм пуснал кода който имам.

:) еми, gl hf
 

Горе