On my JSP page with multiple div tags, of which I want to make a particular div non refreshable so that it retains its value when the jsp submits a form to servlet.
I am loosing div data as soon as the form is submitted to upload files.
How to do this without using ajax?
I've searched a lot but only could find ways to make a div refreshable.
In my below JSP page code, the form myform is submitted to upload.java and is redirected back to this jsp page. Now, I don't want to loose the contents of box div.
My JSP page
<div id="box">${f1stat}<br>${f2stat}<br>${f3stat}</div>
<div style="position: absolute; right: -5%; top: 2%;">
<form method="post" name="myform" action="upload" enctype="multipart/form-data">
Left File : <input type="file" name="dataFile1" id="fileChooser1" />
Right File : <input type="file" name="dataFile2" id="fileChooser2" />
Config File :<input type="file" name="dataFile3" id="fileChooser3" />
Geco File : <input type="file" name="dataFile4" id="fileChooser4" />
<input type="hidden" id="myField" value="" />
<button type="button" id="execute" onclick="ValidateFile()">Click to Upload files</button>
<button type= "button" id="execute" onclick="saveTextAsFile()">Click to execute</button>
</form>
</div>
the box div is populated during execution by commands like
var err1 = document.getElementById("box");
err1.innerHTML = err1.innerHTML + "<br>" + "<span class='red'>Configuration file and Geco script should not be the same as left or right files. Please check your uploads</span>";
I am using the box div like a console display
Servlet redirecting by
RequestDispatcher rd = request.getRequestDispatcher("geco.jsp");
rd.forward(request, response);
What comes to mind is saving the data on first load into a session scoped variable, then checking if that variable has a value on subsequent loads before setting it. That way your value will be retained:
<c:if test="${empty test}">
<c:set var="test" value="${objectWithData}" scope="session" />
</c:if>
Then use the properties of the object saved in the var to display info in your div.
Related
i am building a form and when i submit it it opens the action url. I want to submit the form on click button which should not open the target url but submit the request. as well as i want to print a message after submit and form should be cleared after submit.
<form id="contact" action="https://control.msg91.com/api/sendhttp.php" method="post">
<h3>Send SMS</h3>
<h4>Build in Process</h4>
<fieldset>
<input name="authkey" type="hidden" value="auth key as required"/>
<input name="mobiles" placeholder="Mobile Number" type="text" tabindex="1" maxlength="10" required >
</fieldset>
<fieldset>
<textarea name="message" placeholder="Type your message here...." tabindex="2" maxlength="320" required></textarea>
</fieldset>
<input name="sender" type="hidden" value="FAKEin" />
<input name="route" type="hidden" value="4" />
<input name="country" type="hidden" value="0" />
<fieldset>
<button name="submit" type="submit" id="contact-submit" data-submit="...Sending">Submit</button>
</fieldset>
</form>
any help how can i do this?
also can i add a hidden text in message tab that should add to the message tab in post/get as + instead of &
eg. actionurl.php?authkey=custommade&mobiles=9999999999&message=orginal+message+hidden+message&sender=FAKEin&route=4&country=0&submit=
You can also check the source code of page https://www.tricksbygoogle.com/sms/sms.php
Basically You can't .
The only solution here I see , is using ajax query and use javascript to clear form.
This example I provide is no redirections at all. What means you page will not be reloaded.
Maybe little jquery will help.
var result_func = function(response){
if(response.allOk){
$this.reset();
}
}
$('#contact').submit(function(e){
e.preventDefault()l
var $this = $(this);
var data = $this.serialize();
$.post($this.attr('action'),data,result_func.bind($this));
});
Header location will work , but user still will be redirected.
Based on your question, and the comments it looks like you're going to have to do a little bit of research. Here are some tips though.
If you would like to include the functions from a page without actually visiting the page, than you can use what is called an include statement. This will keep the browser from visiting that page while still executing it. - http://php.net/manual/en/function.include.php
To display a message you're going to need to hide and show the element with javascript. I would suggest viewing this question - Hide div after a few seconds
Basically on submit, you're going to want to check for the variables from your form. You would run a php if statement.
Then, if those variables exist you are going to want to include your action page.
In the same if statement, you're going to want to echo a <div> with a class that has some javascript attached to it to hide it after a few seconds.
The form will automatically clear on submit.
if($variable != null){
include '/action.php' // --- you can add some GET variables to the end of this if you would like to.
echo '<div id="message">Message sent</div>'
}
Page1.JSP
//input text box
Enter Form id:<input type="text" name="formID" id="formID" >
Show Form
This returns a null value. In page2. JSP
//get the input value
<%String formsubmitID=request.getParameter("formID");%>
This returns null. I am not able to parse. I tried all the methods using window.location, adding a button adding a href link but i am not able to access the input text field and redirect both at the same time. Here is the code for first JSP Page from which I need to redirect to another JSP Page with the input text field entered at Firest JSP Page.
I tried using a button and redirect in Java script
//javascript for redirecting to another page
function redirect(elem){
alert("in redirect Method:")
elem.setAttribute("action","Page2.jsp");
elem.submit();
return false;
}
// Page1.JSP
<form ACTION="Page2.jsp" METHOD="POST" onload='onload()'>
Enter Form id:<input type="text" name="formID" id="formID"/>
<INPUT TYPE="SUBMIT" value="Submit" onclick="redirect(this);">
</form>
This also doesn't work. Redirect doesn't happen at all when I am using window.location.href or window.location.
Please help me find the solution for the same.
When you are using form than whenever you click on button you will be directed to Page2.jsp (i.e. url mentioned in form action) like
<form ACTION="Page2.jsp">
Enter Form id:<input type="text" name="formID" id="formID"/>
<INPUT TYPE="SUBMIT" value="Submit">
</form>
In Page2.jsp get value of text field like
<%String formsubmitID=request.getParameter("formID");%>
I have a file input element outside the form. and on form submit i want to send the file content to server as multipart form data. I can't insert the file element into the form. Is there any other way to do this.
<input type="file" class="file" style="width:117px" name="c2vFile" onchange="onFileChange2(this.value);"/>
<form style="display:none" id="frmActivate" enctype="multipart/form-data">
<input type="hidden" id="act_groupActivationJson" name="groupActivationJson" />
<input type="hidden" id="act_remarks" name="comments" />
<input type="hidden" id="activatee" name="activatee" />
</form>
The file input needs to be inside the form tag. You've mentioned you can't, but why not? You would need to remove the "display:none", which serves no purpose currently, as the inputs are all hidden.
You can send a file outside of form tag using AJAX submission. You can follow the below link will helpful for sending file using ajax.
But you have have to invoke this function on click of submit button. Once the file upload done then form submit should be happen.
jQuery Ajax File Upload
I did a small trick with this and it worked, please review if it is helpful for you
Before submitting the form add listener and append the input field with the form.
document.getElementById('frmActivate').addEventListener("submit", function() {
var fileinput = document.getElementById('filein');//take the file input
var thisel = document.getElementById('frmActivate');// take the form element
var cln = fileinput.cloneNode(true);//clone the file input element
thisel.appendChild(cln);//append the clone in the form element
thisel.submit();
})
<input type="file" id="filein" class="file" style="width: 117px" name="c2vFile" onchange="onFileChange2(this.value);" />
<form style="" id="frmActivate" enctype="multipart/form-data">
<input type="hidden" id="act_groupActivationJson" name="groupActivationJson" />
<input type="hidden" id="act_remarks" name="comments" />
<input type="hidden" id="activatee" name="activatee" />
<input type="submit" value="submit" />
</form>
<?php var_dump($_FILES);//to confirm if file is submitted ?>
You can see this code working in this demo
Hope this works for you.
I am using Bootstrap-Form-Builder to generate dynamic HTML forms. Here is an example. It's working just perfect.
Now I need to create a static page with the code rendered in the rendered tab. My problem is that I am unable to get the rendered code because it's made dynamically. I tried to get the data using jQuery, like this:
$(document).ready(function(){
$("#btn").click(function(){
alert($("#build").clone().html());
});
});
#btn is a button I added and #build is the id of a div where the form is dynamically generated. I was able to get the whole information including the setting HTML of the form. What I want is only the rendered area's HTML.
Here is the code that showed up when using alert($("#build").clone().html());:
<form id="target" class="form-horizontal">
<fieldset><div data-html="true" data-trigger="manual" data-title="Form Name" data-content="<form class='form'>
<div class='controls'>
<label class='control-label'> Form Name </label>
<input class='input-large field' data-type="input" type='text' name='name' id='name' value ='Form Name' />
<hr/>
<button id="save" class='btn btn-info'>Save</button><button id="cancel" class='btn btn-danger'>Cancel</button>
</div>
</form>
" class="component"><!-- Form Name -->
<legend>Form Name</legend>
</div></fieldset></form>
As you can see, it contains extra data not provided in the rendered area. Please ask me if something is not clear.
I need to retype a bunch of names written on a paper and make a digital copy of it to a computer (a txt file). Then copy/paste each name and submit it again into a website one by one. Type one name then submit, wait until the page reloads, then repeat again. I saved the html file of the website but I don't have access to website's server. I was thinking I could modify the html file I saved so I'll just copy/paste once then click submit once. I'm not sure if it's possible to copy the names from the text file and embed it in the html code or maybe make a code to read the names from the txt file.
Honestly, I don't mind copy and pasting the names one by one into the website. What slows me down is the page reload time and the website only has one input field. It takes a few seconds to reload after submitting one name. So I want to be able to copy paste all then submit it once. I saved a local copy of the html file of the website and added action="website.com/xxxx" so it submits it to the website even if the html file is saved on my computer. The code below is a part of the website's html code:
<form method="post" action="website.com/xxxx">
<input type="text" name="t" style="width:250px">
<button type="submit"><p>Submit<img src="submit.png" style="width:32px;vertical-align:middle"></p></button>
</form>
I was thinking if I could modify it like this:
<form method="post" action="website.com/xxxx">
<input type="text" name="t" style="width:250px" value="jane">
<input type="text" name="t" style="width:250px" value="jenny">
<input type="text" name="t" style="width:250px" value="mark">
<input type="text" name="t" style="width:250px" value="ben">
<input type="text" name="t" style="width:250px" value="cathy">
<button type="submit"><p>Submit<img src="submit.png" style="width:32px;vertical-align:middle"></p></button>
</form>
If you have PHP with HttpRequest installed, you can try something like this
<?php
$url = 'http://website.com/xxxx'; // url of the form action, not the form itself
$names = file('names.txt');
for($names as $name){
$request = new HttpRequest($url, HTTP_METH_POST);
$request->addPostFields(array('t' => trim($name)));
$request->send();
}
If you have PHP but no HttpRequets, you can use cURL, but I have absolutely no idea how it is working.
Other languages should have similar possibilities.