We Keep Coding

How to trigger a javascript function when servlet forward action

I have a jsp page in my project. In this jsp page, I have inputs that are filling by javascript function. When the servlet post action happens, this input's values are disappears. I want to fill these input again when the servlet forwarded the jsp page. So, is it possible to trigger a javascript function from servlet?
My JSP page codes
<div style="margin-left:7%; margin-right:10%; border-style:groove;">
<div style="margin-right:65&; margin-left:5px;">
<label for="salesOrder">Sales Order</label> <input id="sOrder" style="margin-left:58px;" onkeyup="this.value = this.value.toUpperCase();" onselect="salesOrder();fill_table();" value="${salesorder}">  <label style="margin-left:75px;">Count:</label> <input type="text" id="count" size="3" style="margin-top:3px;"><br>
<label>Ind. Date:</label>  <input type="text" id="induction" style="margin-left:59px;" size="15"><br>
<label>Customer/Operator:</label> <textarea id="customer" rows="1" cols="10" wrap="soft"></textarea> <textarea id="operator" rows="1" cols="10" wrap="soft"></textarea><br>
<label>Removal Reason:</label> <textarea rows="2" cols="30" wrap="soft" id="rem_reason" style="margin-left:10px; height:50px; text-size:10px;"></textarea>
</div>
<div style="margin-left:45%; margin-top:-130px;">
<input type="checkbox" name="v2500" value="V2500-A5" onclick="check_v25()"> <label for="v2500">V2500-A5</label><br>
<input type="checkbox" name="7b" value="CFM56-7B" onclick="check_7b()"> <label for="7b">CFM56-7B</label><br>
<input type="checkbox" name="5c" value="CFM56-5C" onclick="check_5c()"> <label for="5c">CFM56-5C</label><br>
<input type="checkbox" name="3" value="CFM56-3" onclick="check_3()"> <label for="3">CFM56-3</label>
</div>
<div style="margin-left:65%; margin-top:-130px;">
<label>TSN:</label>  <input type="text" id="tsn" style="margin-left:1px;"><br>
<label>CSN:</label>  <input type="text" id="csn" style="margin-left:-0.5px;"><br>
<label>TSLSV:</label>  <input type="text" id="tslsv" style="margin-left:-1px;"><br>
<label>CSLSV:</label>  <input type="text" id="cslsv" style="margin-left:-3px;">
</div>
</div>
My JavaScript function
<script>
function salesOrder(event,ui){
$("#sOrder").val(ui.item.label);
var salesOrder=$("#sOrder").val();
var URL_PREFIX="http://ptrisd01:8983/solr/SalesOrderCore/select?q=STRSO:";
var URL=URL_PREFIX+salesOrder;
$.ajax({
url : URL,
dataType : 'json',
type:'get',
json : 'json.wrf',
success:function(data){
console.log("success");
var docs = JSON.stringify(data.response.docs);
var jsonData = JSON.parse(docs);
document.getElementById("induction").value=jsonData[0].STRINDDATE;
document.getElementById("customer").value=jsonData[0].STRCUSTOMER;
document.getElementById("operator").value=jsonData[0].STROPERATOR;
document.getElementById("rem_reason").value=jsonData[0].STRREMREASON;
document.getElementById("tsn").value=jsonData[0].STRTSN;
document.getElementById("csn").value=jsonData[0].STRCSN;
document.getElementById("tslsv").value=jsonData[0].STRTSLSV;
document.getElementById("cslsv").value=jsonData[0].STRCSLSV;
}
});
};
</script>
A part of my servlet codes
request.setAttribute("salesorder", salesOrder_hidden);
PrintWriter out = response.getWriter();
out.println("<script type=\"text/javascript\">");
//out.println("alert('Saving completed...');");
//out.println("location='upload.jsp';");
out.println("salesOrder();");
out.println("</script>");
request.getRequestDispatcher("upload.jsp").forward(request, response);
Also, I'm using JQuery Autocomplete for sOrder input.

What Swati said. Looks like you don't know about sessions yet. If you do it with Java, create Session at the servlet.
HttpSession session = request.getSession();
session.setAttribute("attributeName", value);
response.sendRedirect("your.jsp");

PHP - Submit button and get value without refresh

Hello I want to get the value of this input and fetch it using ajax no database at all. thank you. how can i do it with ajax?
<form method="POST">
<input type="text" name="input" id="card-code" value='<?php echo $code ?>' class="form-control">
<input type="text" id="card-pin" value='<?php echo $code2 ?>' class="form-control" maxlength="3">
</form>
there is my inputs and here is the button.
<form action="top-up.php" method="POST">
</div>
</div>
<div class="col-md-6" style="margin-top: -160px">
<div class="caption">
<div class="jumbotron">
<textarea class="form-control text-center" id="scanned-QR" name="lblQrTxt" onchange = "change()"></textarea><br><br><br>
<input class="btn btn-primary btn-lg" type="submit" name="btnSubcode" value="PROCESS"></input>
</div>
</div>
</div>
</div>
</form>
so the final output sould not refresh the page and the textarea value will be send to the textbox

The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX. The main methods, ajaxForm and ajaxSubmit, gather information from the form element to determine how to manage the submit process.
http://malsup.com/jquery/form/#getting-started
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
});
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<form id="myForm" action="comment.php" method="post">
Name: <input type="text" name="name" />
Comment: <textarea name="comment"></textarea>
<input type="submit" value="Submit Comment" />
</form>
// prepare Options Object
var options = {
target: '#divToUpdate',
url: 'comment.php',
success: function() {
alert('Thanks for your comment!');
}
};
// pass options to ajaxForm
$('#myForm').ajaxForm(options);

Firstly, rewrite your html code as below:
<form id="form" action="top-up.php" method="POST">
</div>
</div>
<div class="col-md-6" style="margin-top: -160px">
<div class="caption">
<div class="jumbotron">
<textarea class="form-control text-center" id="scanned-QR" name="lblQrTxt"></textarea><br><br><br>
<input class="btn btn-primary btn-lg js-form-submit" type="submit"></input>
</div>
</div>
</div>
</div>
</form>
Then, you can write JS something like this:
$(document).on('click','.js-form-submit', function (e) {
e.preventDefault();
var formData = $('#form').serialize();
var url = $('#form').attr('action');
$.ajax({
type: "POST",
cache: false,
url: url // Your php url here
data : formData,
dataType: "json",
success: function(response) {
//var obj = jQuery.parseJSON(response); if the dataType is not specified as json uncomment this
// do what ever you want with the server response
},
error: function() {
alert('error handling here');
}
});
});

Ck Editor does't take value while using jquery why?

I have create a form where I have define ckeditor which is work perfectly. Here I want to submit form value through jQuery but when I click on submit button it does't get ckeditor value on single click where other text field took its value on same click why ckeditor does't ? So, How can I fix this problem? Please help me.
code:
<script>
$(document).ready(function(){
$("#submit").click(function(){
category = $("#category").val();
temp_name = $("#temp_name").val();
template_text = $("#template_text").val();
$.ajax({
type:"POST",
data:{"admin_id":admin_id, "category":category, "temp_name":temp_name, "template_text":template_text},
url:"<?php echo base_url('index.php/'); ?>setting/add_template",
success: function(data){
$("#pro").html(data);
}
});
});
});
</script>
<form method="post">
<label for="name">Category<span class="required">*</span></label>
<input type="text" name="category" id="category" required="required" />
<label for="email">Template Name<span class="required">*</span></label>
<input type="text" name="temp_name" id="temp_name" required="required" />
<label for="email">Template Text<span class="required">*</span></label>
<textarea class="ckeditor" name="template_text" id="template_text"></textarea>
<input type="submit" name="submit" id="submit" class="btn btn-success" value="submit">
</form>

Retrieve JSON values from ejs

I am new to node and ejs, I have below code, and need to know how to get the values from EJs file to post it to mongoDB
EJS file
<form>
<p>
<label for="username"> Username </label>
<input type="text" for="username"/>
</p>
<p>
<label for="password"> Password </label>
<input type="password" for="password" />
</p>
<p>
<label for="email"> Email </label>
<input type="text" for="email"/>
</p>
<button type="submit">Log In</button>
</form>
JS file
$('form').on('submit', function(){
var item = $('form input');
var user = [{username:item.val()},{password:item.val()},{email:item.val()}];
console.log(user);
$.ajax({
type: 'POST',
url: '/register',
data: user,
success: function(data){
//do something with the data via front-end framework
console.log(data);
location.reload();
}
});
return false;
});
As of now when I insert to mongo DB I get a new uuid but the values are going in as "0"
please aasist

So the line var item = $('form input'); is actually a collection of each input, while the line var user = [{username:item.val()},{password:item.val()},{email:item.val()}]; is only grabbing the value of the first one (this is because of how jQuery can appear to hide a collection), instead I would try this (assuming you wanted to grab specific values out of that form):
var items = $('form');
var user = {
username: $('[name=username]', items).val(),
password: $('[name=password]', items).val(),
email: $('[name=email]', items).val()
};
With following change to your html
<form>
<p>
<label for="input-username"> Username </label>
<input type="text" id="input-username" name="username"/>
</p>
<p>
<label for="input-password"> Password </label>
<input type="password" id="input-password" name="password" />
</p>
<p>
<label for="input-email"> Email </label>
<input type="text" id="input-email" name="email"/>
</p>
<button type="submit">Log In</button>
</form>
Also the for attribute in the <label> element is to associate with an <input> that has an id attribute with the same value. So considering that ids should be unique and only resolve to a single element I would suggest adding some kind of name spacing like input- to them.

Working with multiple ajax forms in same page

After a suggestion from this question Multiple forms in in a page - load error messages via ajax
I am trying to work multiple forms in same page. I am trying to append error messages in to the respective input div classes.
I don't want to have different form ids because i need to have single id in the jquery then.
I have forms like
<form class="myform" name="myform">
<div class="name">
<input type="text" name="name" />
</div>
<div class="message">
<input type="text" name="message" />
</div>
<input type="submit" name="submit" />
</form>
<!-- second form -->
<form class="myform" name="myform">
<div class="name">
<input type="text" name="age" />
</div>
<div class="message">
<input type="text" name="gender" />
</div>
<input type="submit" name="submit" />
</form>
and the jQuery part is
$('.myform').on('submit', function(event) {
postform = $(this);
event.preventDefault();
$(this).ajaxSubmit({
url: 'process.php',
type: 'post',
dataType: 'json',
success: function( response ){
$.each(response, function(index, element){
var msgdiv = postform.children('div.' + divclass).append('<span>'+message+'</span>');
}
}
});
});
however the ajax part is working but the error messages do not load in the div tags as defined in the jQuery 'div.' + divclass. Any help would be appreciated

Like this?
postform.find('.message').append('<span>' + message + '</span>');