I've seen examples of a form being submitted and a new window being opened via _blank. However, I can't seem to reproduce the results. See my code, below.
In the <head> tag:
<script type="text/javascript" lang="javascript">
function submitForm(formId) {
newDialog = window.open('http://redhue.ir/upload/upload.php', '_form','status=no,scrollbars=no');
document.forms[formId].target='_form';
document.forms[formId].submit();
return false;
}
</script>
In the <body> tag:
<form action="#" method="post" enctype="multipart/form-data" onsubmit="return submitForm(this)">
But it just opens the new window and goes to test.php, but the form doesn't work, and there is no POST action, which means that test.php does not receive any form input.
What am I doing wrong, and how can this issue be resolved?
Related
I am about to start a work on a alert box or Modal, that will Pop-up when the sites loads and after 10 seconds it disappear.
I am looking for a html/css solution, if possible.
Can any body lend me an idea on how to achieve it?
Here's a working example based on what you need as a modal popup.
<html>
<head>
<title>Model popup box</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('#modal').delay(10000).fadeOut();
});
</script>
</head>
<body>
<div id=modal > Hello, i am a modal popup </div>
</body>
</html>
I would like to create a for to post some data which is a date to be chosen and there will be 2 buttons.
1 button needs to post the data on the same page and another button needs to post the data on a different page.
What I don't understand is how I can specify that in the 2 buttons as they are in the same form.
Thanks for your help,
John.
Do something like this with jQuery
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#first").click(function(){
$("#for").attr("action","ad.html");
$("#for").submit();
});
$("#second").click(function(){
$("#for").attr("action","test.html");
$("#for").submit();
});
});
</script>
<body>
<form id="for">
input : <input type="text">
</form>
<button id="first">Subit First</button><button id="second">Submit Second</button>
</body>
All the best
I know that if we've a <form> and an <input> with or without submit button, on pressing Enter key will submit that enclosing form. But, IE is submitting (specifically, clicking the first button it encounters) even when there is no <form> tag present.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button onclick="alert('button 1 clicked')">button 1</button>
<button onclick="alert('button 2 clicked')">button 2</button>
<input type="text" />
</body>
</html>
above markup in Plunkr.
When 'Enter' is pressed with in input field, 'button 1 clicked' alert will be seen.
If I surround <input> with a <form> tag, it is not submitting.
Plunkr
This behavior is observed in IE9 and IE 10 too (haven't tested other versions). Is this a bug in IE or if it is not, how to stop this happening?
Update: if I add, type="button", the said behavior is not observed.
Is the default behavior for a <button> tag a submit? and, only IE is behaving like this?
if I add, type="button", the said behavior is not observed. Is the default behavior for a tag a submit? and, only IE is behaving like this?
This answer helped me in identifying adding type="button" will not cause this effect
You can prevent IE from submitting the form by adding 'return false;' in the onclick event. Here is the code :
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button onclick="alert('button 1 clicked'); return false; ">button 1</button>
<button onclick="alert('button 2 clicked'); return false; ">button 2</button>
<input type="text" />
</body>
</html>
Moreover you can also prevent the Submit button from submitting the form by adding 'return false' to it.
I need to show details on the popup. I don't have any idea how to do this. I need to do it in a MVC3 Razor view.
my Controller-
public ViewResult ViewDetail(Int32 id)
{
var q = from p in db.accs
where p.id == id
select p;
return View(q.FirstOrDefault());
}
my View-
<td># Html.ActionLink("View Detail", "ViewDetail", new { id=item.id }) </td>
use the Jquery UI ModalForm to show up your data.
Say you want to display the following in Modal pop-up of jquery .
<div id="displayinmodal">
<input type="file" id="file" name="file" />
<input type="submit" id="submitdata" value="Upload" />
</div>
Now write your jquery like this.
<script>
$(document).ready(function(){
$("#displayinmodal").dialog({ //displayinmodal is the id of the div you want to display in modal popup
autoOpen: true
});
});
</script>
That's it. you should get Modal popup in your browser.
Hope this helps
This kind of task isn't really what ASP.NET MVC / Razor does. Consider using a Javascript library like JQuery UI Dialog. You have to add several of the JQuery UI scripts to your page, but the payoff is a very simple API; you can create a basic dialog out of any HTML element (say with id mydiv) with one line of code:
$( "#mydiv" ).dialog();
And of course there are customizations and themes you can apply.
Of course, you could simply use the Javascript:
alert("my details here");
to get a basic modal popup, but I'm guessing that's not what you want.
If you want a simple no frills modal (with not much content) you can use a JavaScript alert like so:
alert('Hello from a modal popup');
If you would like a prettier option a common solution is to use jQuery UI's dialog which allows for a modal option. Take a look here for a demo of what you get with this option:
http://jqueryui.com/demos/dialog/#modal
The code is pretty simple; the below should do everything for you using Google's CDN as a source for the scripts and stock jQuery UI CSS:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function() {
$( "#details" ).dialog({
modal: true
});
});
</script>
<div id="details">
Hello from a modal popup
</div>
all browsers are fine with my code except the IE. Do you know what I can do better to get it also run with the IE?
<script>
function submitForm(formId) {
var w = window.open('', 'myPopup', "width=600, height=600");
$(formId).attr('target', 'myPopup');
$(formId).submit();
w.focus();
return false;
}
</script>
<form target="myPopup" onsubmit="return submitForm(this);" method="post" action="" name="myForm" id="myForm">
<input type="submit" />
</form>
I found it out. I just wanted to comment that the "onsubmit" handler produces an endless loop. Then I found this bug report:
If you want to submit a form, you need to access the form’s submit
method, e.g. $('form')[0].submit(). When you call $('form').submit()
you are generating a submit event, so your event handler gets called
in an endless loop.
So the solution is to change
$(formId).submit();
to
$(formId)[0].submit();