hi i have a link when clicked opens a colorbox with a form in it what i want that when i click on the submit button the form will be submitted via ajax and based on the returned data
if(error on the server side){
the error will be displayed at the top of the form;
// colorbox still open
}else{
the returned data will be displayed on the original page;
close the colorbox;
}
so i did all that except the close colorbox part i used this code:
$.colorbox.close();
and this didn't work too:
parent.jQuery.colorbox.close();
any help, thanx in advance.
Had this a while back, cant remember which it is...
Try this...
$(window).colorbox.close();
or this...
jQuery(window).colorbox.close();
or this...
jQuery('#cboxClose').click();
Related
I'm working on a group project for a class, and we have a webpage that is split into different tabs, so it is only one webpage, but appears to be different pages using Jquery so the page doesn't have to reload when switching between tabs. The problem I am having is that one of the tabs has a form to get information from the user, then after the user clicks the submit button, the info is sent to the database using php, causing the page to reload. Then depending on if the information was successfully sent to the database, there will be either "success" or "invalid" appended to the end of the URL. If the user submits this form, we want them to automatically come back to this tab on the reload, and I have tried doing this by using a script like this:
<script>
document.getElementById("baseTab").click();
window.onload = function() {
var theurl = document.location.href;
if (theurl.includes("success") || theurl.includes("invalid") {
document.getElementById("infoTab").click();
}
};
</script>
The baseTab is the tab we want to load whenever someone first loads the webpage, unless they have just submitted the form on the infoTab page. This code structure works on a simple test webpage I run on my computer, but when I try to push it to our project repository, it will only do the "baseTab".click, and not click the "infoTab" button even if theurl includes "success" or "invalid". I tried doing it without the window.onload(), but that doesn't work either. Also, if I do
if (theurl.includes("success") || theurl.includes("invalid") {
document.getElementById("infoTab").click();
}
else {
document.getElementById("baseTab").click();
}
then neither of the buttons get clicked. If their is an easier way to do this or you see where I am going wrong, any help would be appreciated. Thanks!
I have a small application I am developing to learn AJAX and JavaScript. In this I have method saveData() that is triggered when a save button is clicked. All is working fine, but I realized that the page was refreshing so I searched the web and found the JavaScript method event.preventDefault(). This method worked fine. But that got me into problem, my modal dialog was staying open instead of closing. Again, I found hide method to "close" the modal. That solved it, BUT when I click the to open the modal it is bringing me the recent data I sent to the DB. I am from Java background and I began to think that hidedid not kill the modal.
My question: Is there a method to completely destroy the modal the way is done with JFrame.dispose()method in Java?
The code I was using is below:
function saveData(){
var name=$('#nm').val();
var email=$('#em').val();
var phone=$('#hp').val();
var address=$('#al').val();
event.preventDefault();//prevent the page from refresh
$.ajax({
type:"post",
url:"server.php?p=add",
data:{nm:name,em:email,hp:phone,al:address},
success: function(data){
viewData();
$('#addData').modal('hide');//close the modal.
}
});
}
You can just clear the values in your input tag every time you open the modal.
I already faced this problem with the modal for clear all value.but i using the follow code after hiding the modal.
My modal id is #modal
$('#modal').hide();
$('#modal')
.find("input,textarea,select")
.val('')
.end()
.find("input[type=checkbox], input[type=radio]")
.prop("checked", "")
.end();
if you have any prolem then you can refer the link that may help you : How to clear all input fields in bootstrap modal when clicking data-dismiss button?
i made form in mailmuch and got code from it , i added to webpage and its working with href , when user click show popup the form is showed. which is ok
show popup
however now i have ajax request and i want this popup to be showed on ajax return success
<a href="#" onclick("getdata(4)")>show popup</a>
so any idea how to do it , because the form is rendered from mailmunch side although if it was in my webpage i should have used simple
$('#popup_id').show();
so how to handle this problem , thanks
Without knowing anything about how mailmunch code works I will assume that all you need to do is trigger a click on the first link within your ajax success:
$.post(url, data,function(){
$('#mailmunch-pop-123').click();
})
Without more code provided it is hard to help more
I have 3 php files: view.php, edit.php and edit2.php.
view.php is where I view the content of my database. I use edit.php to enter new data and it's a small window that in which I type in a content I want to include in my db.
Then, I pass all of the data to edit2.php which doesn't display anything but only has implemented MySQL queries.
Now I would like to have something like this:
I'm on view.php. I click a button, edit.php opens as a new, small window. I enter the data, click SUBMIT button, everything is sent to edit2.php but at the same time the window is closed and view.php is refreshed.
I would be thankful if you could help. Thanks in advance.
You can use the js function window.opener.location.reload().There is no need of ajax for refreshing the page..Simple js is enough.
You may use
header('Location: view.php');
at the end of your edit2.php
Add following code to your edit.php
<script>
window.onunload = refreshParent;
function refreshParent() {
window.opener.location.reload();
}
</script>
I have a problem. I have a page that when you click a button, a popup with a form is shown. So, I complete some data and I submit. What I want to do is, to submit the form, close the form and refresh the parent page. I don't want to do it with AJAX.
The problem is that in my parent page I have to refresh content with the input information of the form.
So when I refresh, sometimes the data is shown and sometimes not. Do you know why this could happen?
I just use onsubmit="refreshParent()" in my form. The info is stored always in my database, so I think the problem may be that sometimes the refresh catches the new info and sometimes not.
function refreshParent() {
window.opener.location.reload();
window.close();
}
I use this to reload the page that opened a popup window:
<script language="JavaScript">
<!--
function reloadParentPage() {
window.opener.location.href = window.opener.location.href;
if (window.opener.progressWindow) {
window.opener.progressWindow.close()
}
window.close();
}
//-->
</script>
By the way, the code above is called by a link or button in the popup page.
You have a race condition between the script doing the insert and the script reloading the parent.
The solution is to call refreshParent on the page after the submit - that way you know the data is in the database. You don't even have to do it on document ready - return a stub page that just defines and calls refreshParent in the head tag.
In PHP when you run post script, at the end, include this code :
echo '<html><script language="javascript">
parent.location.href="http://'.$_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"].'"; // or any other url
</script></html>';
This will output a javascript that will reload the windows.