Проблем с форма във поп ъп

Post Reply
User avatar
inferno16
Нов
Нов
Reactions: 0
Posts: 91
Joined: Thu Jun 21, 2012 4:37 pm

Проблем с форма във поп ъп

Post by inferno16 »

Съжалявам че правя още една тема със сходен проблем но срещам трудности при изпълнението на форма във поп ъп
JS:[js]
function showPopup(page)
{
greyout(true);
var posh = (screen.height / 2) - 236;
var posw = (screen.width / 2) - 310;
document.getElementById('new-pop').style.display = 'block';
document.getElementById('new-pop-style').style.marginTop = posh+"px";
document.getElementById('new-pop-style').style.marginLeft = posw+"px";
document.getElementById('new-pop-content').innerHTML = '<br><br><br><center><img src="images/load.gif"></center><br><br><br><br>';
$("#new-pop-content").load("<?php echo $smurl; ?>" + page);
}[/js]
Това което правя е да затъмня екрана, да създам променливи които да намерят пикселите необходими за центрирането на див-а, да покажа поп ъп-а, да го центрирам да сложа картинка за зареждане докато отвори страницата и накрая да я заредя.

Тук викам функцията.
HTML:[html]<div class="button-l" onclick="javascript:showPopup('page.php')">[/html]
Във въпросния page.php има проста форма с 2 текстови полета и 1 събмит бутон. Правя селект заявка към базата и извеждам резултатите. Всичко работи точно по план с изключение на това че поп ъп-а се затваря след като натисна събмита. Ако отворя директно файла си извежда всичко. Предполагам че нещо в JS съм сгафил как да направя така че след събмита да не ми затвори поп ъп-а а да ми изведе резултатите в него?
User avatar
inferno16
Нов
Нов
Reactions: 0
Posts: 91
Joined: Thu Jun 21, 2012 4:37 pm

Post by inferno16 »

Никой не ми отговори и така след няколко дена главоболия днес го измислих. Заместих content див-а със iframe таг + промяна в скрипта и много промени в css-а ако случайно някой се интересува ето как изглежда в момента кода
[js]
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px'; //С това правя така че iframe-а да се разгъва при повече съдържание а не да се появява скрол бара (задал съм и max-height:400px; за да спре да се разгъва на 400px и да се появи скрол бара)
}

function showPopup(page){
greyout(true); //Не обръщай внимание това е функция чиято дефиниция не съм копирал тук
var posh = $("#new-pop").innerHeight()/2; //Намирам половината от височината на поп ъп-а
var posw = $("#new-pop").innerWidth()/2; //Намирам половината от ширината на поп ъп-а
document.getElementById('new-pop').style.display = 'block'; //Показвам поп ъп-а (предварително съм задал display:none; )
document.getElementById('pop-x').style.display = 'block'; //Показвам бутона за затваряне (предварително съм задал display:none; )
document.getElementById('new-pop').style.marginTop = '-'+posh+'px'; //Намествам поп ъп-а (предварително съм задал top:35%; )
document.getElementById('new-pop').style.marginLeft = '-'+posw+'px';//Намествам поп ъп-а (предварително съм задал left:50%; )
document.getElementById('new-pop-content').src ="<?php echo $smurl; ?>"+page; //Променям src атрибута на iframe-а на исканата страница
}

function hidePopup(page){
greyout(false); //Не обръщай внимание това е функция чиято дефиниция не съм копирал тук
document.getElementById('new-pop').style.display = 'none'; //Скривам поп ъп-а
document.getElementById('pop-x').style.display = 'none'; //Скривам бутона за затваряне
document.getElementById('new-pop-content').src =""; //Затварям отворената в iframe-а страница.
}
[/js]

Тук ми е кода със поп ъп-а
[html]
<div id="new-pop" class="new-pop">
<div style="position:fixed;"><div id="pop-x" onclick="hidePopup()">Close &nbsp;&nbsp;[x]</div></div>
<img src="images/load.gif" style="position:absolute; margin-top:90px; margin-left:277px; z-index:997;">
<iframe id="new-pop-content" frameborder="0" onload='javascript:resizeIframe(this);'></iframe>
</div>
[/html]

а ето на тези места викам функцията за показване на поп ъп-а:
[html]
<div class="button-l" onclick="javascript:showPopup('mob-displayid.php')">
DISPLAY ID
<div class="button-s">FINDER TOOL</div>
</div>

<div class="button-l" onclick="javascript:showPopup('mob-faction.php')">
FACTION ID
<div class="button-s">FINDER TOOL</div>
</div>
[/html]

EDIT: Тествано под Chrome 28.0.1500.95 m, Firefox 23.0, Opera 15.0.1147.153 и IE 8.0.6001.18702 - изкарва го абсолютно еднакво.
Post Reply