I have struts2 with dojo submit button(ajax call) in dialog window.I want to retain the popup window after submit the button.but its not retain the same form.
<div id="dialog-form">
<form action="finder" method="post" id="form1">
<textarea id="products" name="productNo"><s:property value='productNo'/>
</textarea>
<sx:submit targets="dialog-form"></sx:submit>
parent page form:
<div id="form_parent">
<form action="search" method="post">
-------------------------
--------------------------
</form>
</div>
searchaction.java
public String finder()
{
---------------------
return "search" //which is going to return parent page.
}
when i'm submitting the page , its closing the popup window and opening parent page. How to retain the popup window ?
I don't know struts2, but following the documentation at http://struts.apache.org/release/2.3.x/docs/dojo-submit.html, I would try something like :
<form id="form1" action="search">
---------
---------
<sx:submit beforeNotifyTopics="/before" />
</form>
<script type="text/javascript">
dojo.event.topic.subscribe("/before", function(event, widget){
dojo.stopEvent(event);
dojo.xhrPost({
form : dojo.byId("form1")
});
});
</script>
Related
I need a help to Fill the Action Filed For Example ("2page") when i open the Website
What i want
<form name="AGXBFS" id="AGXBFS" action="2page" method="post" autocomplete="off">
What i Got is :
<form name="AGXBFS" id="AGXBFS" action="" method="post" autocomplete="off">
what i tried
$('#AGXBFS').submit(function (event)
{
var action = 'appointment.php';
// compute action here...
$(this).attr('action', action);
});
this work but only when i click i want it to change without Clicking any Ideas how to do that With Java/Jquery
I would like to submit form when an element is selected - skipping pressing the submit button.
I tried using onchange="this.form.submit()", but it's not working here.
This is the code:
<form action="" method="get">
<div class="ui floating dropdown labeled search icon button dd">
<input type="hidden" name="nutr_code">
<span class="text">Select nutrient</span>
<div class="menu">
<div class="item" data-value="ca">Calcium</div>
<div class="item" data-value="fe">Iron</div>
<div class="item" data-value="mg">Magnesium</div>
<div class="item" data-value="zn">Zinc</div>
</div>
</div>
<br><br>
<input type="submit" value="Show results">
</form>
Because you are using GET method you can redirect with javascript by constructing the url yourself.
$('.ui.dropdown').dropdown({
'onChange': function (value, text, $choice) {
location.href = 'http://example.com/?nutr_code=' + value;
}});
Second option is changing the input field 'nutr_code' with the value from the callback as shown above
$('input[name="nutr_code"]').val(value);
and submit the <FORM/> from js.
$('form').submit();
EDIT:
Example of second option.
$('.ui.dropdown').dropdown({
'onChange': function (value, text, $choice) {
// Uncomment if semantic is not updating the input before submit.
//$('input[name="nutr_code"]').val(value);
$('form').submit();
}});
You need to define action in form tag or add some method to submit button
<input type="submit" value="Show results" onclick="someFunction()">
You need to define someFunction() too if you follow this way. Thanks
You Can Use Jquery
$(document).ready(function(){
$("input[name='nutr_code']").on('input',function(e){
$("input[type='submit']").trigger( "click" );
});
});
I have two forms being toggled as shown below. What I need to figure out, is how to show the correct form once it has been submitted and page refreshed. It will default to the lookup_form only currently. I have been browsing the internet for answers, but am not finding any good examples.
<div class="lookup_form">
<form method="POST" action="" id="lookup_form"></form>
</div>
<div class="nolookup_form">
<form method="POST" action="" id="nolookup_form"></form>
</div>
<a href="#" class="show"> //Firing off the script
<script>
jQuery(document).ready(function($) {
$(".nolookup_form").hide();
$(".show").click(function(){
$(".lookup_form, .nolookup_form").slideToggle("slow, linear");
});
});
</script>
Essentially I need to always show after refresh the actual form that was submitted.
I guess that you know what form you should show at the backend that produces your page, you can just pass that to javascript
<script>
var showForm2 = <?php echo $shouldShow2ndForm?'true':'false'; ?>;
if( showForm2 ){
//hide form1 and show form2
} else {
//hide form2 and show form1
}
</script>
You may use cookie or LocalStorage:
before submitting the form you can save the form id for example with:
localStorage.setItem("formId", "lookup_form");
and on dom ready you can test the value of this:
localStorage.getItem("formId")
An example:
jQuery(document).ready(function($) {
//
// on DOM Ready get formId from localstorage
//
var formId = localStorage.getItem("formId");
if (formId == null) { // never set: set the default value
formId = 'nolookup_form';
localStorage.setItem("formId", formId);
}
//
// Hide the other form
//
$("form:not(#" + formId + ")").hide();
//
// on form submit save in localstorage current form id
//
$('form').on('submit', function(e) {
e.preventDefault();
localStorage.setItem("formId", this.id);
});
$("#show").on('click', function(e) {
$("#lookup_form, #nolookup_form").slideToggle("slow, linear");
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="POST" action="" id="lookup_form">
<p>First form</p>
<button type="submit">Submit lookup</button>
</form>
<form method="POST" action="" id="nolookup_form">
<p>Second form</p>
<button type="submit">Submit nolookup</button>
</form>
<button type="button" id="show">Show</button>
By clicking on "empty cart?", I am unsetting the cart array which is working fine. Now I wanted another form to be hidden if this "empty cart" button is clicked.
html:
<form id="f1" action="checkout.php" method="post">
<input name="cust_login" type="submit" value="Continue" />
</form>
<br>
<button>empty cart?</button>
javascript:
<script>
$(document).ready(function(){
$("button").click(function(){
$("#f1").hide();
});
});
</script>
php code for unsetting array:
if (isset($_GET['cmd']) && $_GET['cmd'] == "emptycart") {
unset($_SESSION["cart_array"]);
But hide is not working here.
My question is, can we use button and link together as I have written ? If not, then how to implement it?
Try to use this:
$(document).ready(function(){
var cmd = '<?php echo $_GET["cmd"] ;?>' ;
if(cmd == "emptycart")
{
$("#f1").hide();
}
});
You can try
$(document).ready(function(){
$("button").click(function(){
$("#f1").attr('style','display: block !important')
});
});
or to add a class to style file that do the same and then just add this class when clicking on the button.
<form id="f1"
action="checkout.php"
style="<?= (isset($_SESSION['cart_array']) && count($_SESSION['cart_array']))? "display:none;": ""; ?>"
method="post">
<input name="cust_login" type="submit" value="Continue" />
</form>
<br>
<button>empty cart?</button>
On rendering form - check if cart is empty - render it on hidden state
But in this case your js code had no sense. So you can add
<script>
$(document).ready(function(){
$(document).on('click', "a[href='cart.php?cmd=emptycart']", function(ev){
ev.preventDefault();
$.get($(this).attr('href', function() {
$("#f1").hide();
});
});
});
</script>
Istead of your js code - this one prevent page reload ( which happens when you click on link ) and send request via AJAX
You can try this solution
HTML
<form id="f1" action="checkout.php" method="post">
<input name="cust_login" type="submit" value="Continue" />
</form>
<br>
<button>empty cart?</button>
JS
$(document).ready(function(){
$("button").click(function(){
//$("#f1").hide();
window.location.href = "cart.php?cmd=emptycart";
});
});
I have 2 divs:
<div class="lobsummary">
<input type="submit" name ="sbmtbtn">
<input type="submit" name ="sbmtbtn">
</div>
<div class="applicationsummary">
</div>
I want to show applicationsummary when sbmtbtn is submitted so I used the below script:
$('.lobsummary input:submit').submit(function (event) {
$('.applicationsummary').show();
$('.lobsummary').hide();
});
But its not working.
EDIT: The divs are enclosed in <% Html.BeginForm("Index", "Home"); %> which I am using to pass values to my controller from the view.
Use event.preventDefault() it stops the default action
$('.lobsummary input[type=submit]').click(function (event) {
event.preventDefault();
alert($(this).index() + 1);
$('.applicationsummary').show();
$('.lobsummary').hide();
});
#Rajaprabhu Aravindasamy is right,use submit() over a form:
$("form").submit( function () {
return false;
} );
HTML on the client side will be like:
<div class="lobsummary">
<form action="/"method="post">
<input type="submit" name ="sbmtbtn">
</form>
<form action="/"method="post">
<input type="submit" name ="sbmtbtn">
</form>
</div>
<div class="applicationsummary">
</div>
Just use click() to test your jquery selection:
$('.applicationsummary').hide();
$(".lobsummary form:eq(0)").click(function () {
alert(1)
$('.applicationsummary').show();
});
$(".lobsummary form:eq(1)").click(function () {
alert(2)
$('.applicationsummary').hide();
});
Then replace the click to submit.
When the form was submitted, it reloaded the whole page and that's why it was not hiding because it was going back to its default view. So I used if statements in my view to hide the forms.