Call the jsp pages based on javascript if else conditions - javascript

I have a jsp form like this.
<form name="search" method="post" action="a.jsp" target="menu_page"
onSubmit="return(setSearchParameters);">
<tr>
<td class="srchtext"> Search No. :</td>
</tr>
<tr>
<td >
<input type="text" name="h_trans_code" class="password" onFocus="this.select();" size="18"></td>
</tr>
</form>
After inputting the search no and click the search button it will call a.jsp page. But Now I want to check the length of Search No & if the Search No length is equal to 14 digit, it should call the new jsp page "b.jsp" else should call "a.jsp" using javascript.

Related

How to Save Data & Open Print Window in one click?

<body>
<form method="post">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="txtName" placeholder="Enter Your Name Please" /></td>
</tr>
<tr>
<td>Address</td>
<td><input type="text" name="txtAdd" placeholder="Enter Your Address Please" /></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="btnSave" value="Click to Save Me...." /></td>
</tr>
</table>
</form>
When I Click Submit Button Data are Saved in Database.
But I want When i submit data data will save and print window should be open
Try with this one
For saving data and open print window in one click you have to use AJAX and on success of AJAX you can open print window. For this change your submit button to simple button and call ajax on button click.
OR
After submitting form you can add script tag instead of header function.
<script>
window.open(URL)
</script>

Javascript event redirecting to another page instead of displaying result in same page

In this piece of code there is a search bar, when I am searching something it will narrow down my search. I am using onkeyup event which call javascript function to search the required data, but after entering some text in search bar when i press enter it is redirecting to the home page instead of display the results.
CODE
<apex:actionFunction name="searchServer" action="{!runSearch}" rerender="results,debug,errors">
<apex:param name="Name" value="" />
</apex:actionFunction>
<table cellpadding="2" cellspacing="2">
<tr>
<!-- style="font-weight:bold;">Defect Name<br/> -->
<td>
<input type="text" id="Name" onkeyup="doSearch();" /> </td>
</tr>
</table>
Any help would be appreciated.
I think the form is submitted on Enter button press.
If you have <apex:form tag then try putting onsubmit="return false;" there.
<apex:form onsubmit="return false;"

onClick didn't work inside form?

Usually I see people use form to create input :
<form action="">
<table>
<tr>
<td><label for="Fname">First Name</label></td>
<td><input type="text" name="Fname" class="form-control" id="fname"></td>
</tr>
<tr>
<td><label for="Lname">Last Name</label></td>
<td><input type="text" name="Lname" class="form-control" id="lname"></td>
</tr>
<tr>
<td><label for="address">address</label></td>
<td><input type="text" name="address" class="form-control" id="address"></td>
</tr>
<tr>
<td><label for="phone">phone</label></td>
<td><input type="text" name="phone" class="form-control" id="phone"></td>
</tr>
<tr>
<td><input type="submit" value="submit" onclick="submit();"></td>
</tr>
</table>
</form>
It's make my submit button didn't work, but as soon as I remove the form tag it's work :
<table>
<tr>
<td><label for="Fname">First Name</label></td>
<td><input type="text" name="Fname" class="form-control" id="fname"></td>
</tr>
<tr>
<td><label for="Lname">Last Name</label></td>
<td><input type="text" name="Lname" class="form-control" id="lname"></td>
</tr>
<tr>
<td><label for="address">address</label></td>
<td><input type="text" name="address" class="form-control" id="address"></td>
</tr>
<tr>
<td><label for="phone">phone</label></td>
<td><input type="text" name="phone" class="form-control" id="phone"></td>
</tr>
<tr>
<td><input type="submit" value="submit" onclick="submit();"></td>
</tr>
</table>
My js only like this :
var Fname= document.getElementById("fname");
var Lname= document.getElementById("lname");
var Address= document.getElementById("address");
var Phone= document.getElementById("phone");
var Result= document.getElementById("result");
function submit(){
var valueFname=Fname.value;
var valueLname=Lname.value;
var valueAddress=Address.value;
var valuePhone=Phone.value;
Result.innerHTML="hello, "+valueFname+" "+valueLname+" good to see you. Your contact number is "+valuePhone+" , and your address "+valueAddress;
}
Why cant I wrap all my input inside form? does it need additional code?
its make my submit button didnt work
No, your submit button is working fine. Therein lies the problem you're seeing, in fact. Your JavaScript code is executing, but the time between showing any output and reloading the page because you've submitted a form is nearly instantaneous.
So your JavaScript works. And your form works. Everything works.
but as soon as i remove the form tag its work
Not quite. When you remove the form tag the form submission no longer works. All you've done is prevent the form from submitting, because you no longer have a form.
why cant i wrap all my input inside form?
You can. But it really depends on what you're trying to do. If you have a form and you want to submit it, use a form element. If you don't want to submit anything as a form, you can leave it out. That's its only purpose.
You can have inputs on the page anywhere you like, they don't need to be in forms. If you just want to interact with them via JavaScript then you can do that without a form element.
Forms are made to make HTTP methods (such as POST or PUT).
So, if you need that input's information take part in a http method, you NEED TO use form.
If your Submit button is made just for internal stuff, don't use form.
A little more information: enter link description here
Form will send the data to the file specified in action and this event is triggered by <input type="submit"/> inside a form.
You can use a <button> tag inside form to achieve what you want.
You need to set the action for your form, it is empty.
Or you can use jQuery

how can I see the url output of submitted form?

there is a website and I want to create the link address that can automate the login process.
from the login page source code, I understood that it will submit the id, passwd values with post method in form.
but I want to know the entire 'url' address which this form submission leads to. I mean, eventually it will pass on the id, passwd values like in 'somewebpage?id=someid&passwd=somepw' right? (of course it will be processed with encodeURIComponent by the form)
this parameter included url address is what I'm looking for because I think if I know this, then I can automate the login process.
However, this address is not explicitly shown(not even for a brief moment). Is there a trick to somehow 'alert()' this url address or view it through chrome developer tools or something?
here's the login page example by the way:
<form id="login" name="login" class="login" method="post"
action="" enctype="application/x-www-form-urlencoded"
style="background-image: url(../main/image/index.gif)">
<input type="hidden" name="url" value="../main/index.cgi" />
<table class="login-form">
<tr>
<td>
<table>
<tr>
<td class="label"><label for="login_id">ID</label></td>
<td class="input">
<input type="text" id="login_id" name="id" value="" onclick="select();" maxlength="8"/>
</td>
</tr>
<tr>
<td class="label"><label for="login_passwd">Passwd</label></td>
<td class="input">
<input type="password" id="login_passwd" name="passwd" value="" onclick="select();" maxlength="8"/>
</td>
</tr>
</table>
</td>
<td>
<input type="submit" id="login_submit" value="Go" />
</td>
</tr>
<tr>
</tr>
</table>
</form>
You should be able to see the POST url in firebug net panel.
Form action attribute defines where the form will be submitted.
<form action="demo_form.asp" method="get">
The current form you have will submit to it self, meaning the current url the form is now on.
You can see the page properties from chrome developer tools network tab.
When there is no url in action the page, the form will post to itself. So all you would need to do is post the username and password to this page using the name of the input. On the server side, the username and password will be checked against the DB. To automate the post process look at the function here: https://stackoverflow.com/a/133997/3402205

How to show the form on click of a button?

I am facing a problem. I have created a form where a user has to input the details about a candidate and also upload his/her image. The problem is that in the form there is a button that says "Click To Add More Candidate", so when this button is clicked the same form should reappear under a division called "moreCandidates". Now to achieve this how should I go about it? Things that are coming in my mind is as follows:
To create a function in javascript that exactly creates the form contents (ie. all the input fields,etc) and onclick of the button "Click To Add More Candidate", call the function under the mentioned division. I can do this as in the past I have done something very similar to this. However, this time I don't think it would be good idea to create the whole form again as I have written a PHP function in between to read a directory.
Or the second thought that I have is to have the form code written in a file called candidate.php and call that file with AJAX. The problem here could be that I might be calling the whole form again (whereas I just want to call the contents of the form like the candidate name, and other stuff)
I very confused at the moment, and help from you all would be greatly appreciated. Thanks in advance.
My html code:
<div id="candidateForm">
<table border="0">
<form method="post" action="formDetails.php" enctype="multipart/form-date">
<tr>
<td>Candidate Name:</td>
<td><input class="candidateForm" type="textbox" name="candidateName" placeholder="Candidate's Name"/></td>
</tr>
<tr>
<td>Enroll No:</td>
<td><input class="candidateForm" type="textbox" name="enrollNumber" placeholder="Enroll No"/></td>
</tr>
<tr>
<td>Candidate Image:</td>
<td><input class="candidateForm" type="file" name="candidateImage" placeholder="Select a Image"/></td>
</tr>
<tr>
<td>Cadidate Post:</td>
<?php
//This is the target folder that is going to be read.
$target="uploads/";
//I an using a directory function in PHP scandir() which scans tha contains of the give directory
$dir=scandir($target);
?>
<td>
<select name="candidatePost">
<option value="candidatePost" select="selected">---------Select---------</option>
<?php
foreach($dir as $folders)
{
//When we loop throung the target folder/directory we get this annoying two folder that is "." and ".." so just to rule then out i m using an IF condition
if($folders!="."&& $folders!="..")
//echo $folders;
echo "<option class='candidateForm' value=$folders>$folders</option>";
}
?>
</select>
</td>
</tr>
<tr>
<td>About The Candidate:</td>
<td><textarea name="aboutCandidate" cols="40" rows="5"></textarea></td>
</tr>
<div id="moreCandidates"> </div>
<tr>
<td></td>
<td><input type="button" value="Click To Add More Candidate"></input> </td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="candidateFormSubmit" value="Press Here To Submit The Details" onclick=""/></td>
</tr>
</form>
</table>
</div>

Categories