Hello and thank for your time. I have a problem with my response.getWriter.write
Here is my jsp code
enter code here
<script>
$(document).ready(function() {
var form = $('#form-registrazione');
form.submit(function () {
$.ajax({
type:'post',
url: 'utente',
data: form.serialize(),
success:function (data) {
var result = data;
if(result == "usernameEsistente"){
alert("IL PENE");
$('#errore').html("NON VA BENE");
}
if(result == "vabene"){
window.location.replace("/index.jsp");
}
}
});
}
}
</script>
and in my servlet "utente" I have this code portion:
if(model.checkUsername(username)){
Utente utente = new Utente();
utente.setUser(username);
utente.setPass(password);
utente.setTipo("Cliente");
model.doSaveNewAccount(utente);
response.getWriter().write("vabene");
}
else{
response.getWriter().write("usernameEsistente");
}
the problem is, the response.getWriter().write() overwrite the whole page
http://imgur.com/a/D5M8r
I don't understand why it stays in the servlet page, and does not return in the jsp page where ajax is.
Related
I want to show a button "Reload Game" after function success instead of this bootstrapDialog box
I need this button to fit over my <div class="tilting"></div> Instead of showing somewhere else on page
You need to use below code inside the success method,
document.getElementsByClassName("tilting")[0].innerHTML="<button type="button">Reload Game</button>";
If you are using jQuery Ajax try it below way,
function loadDoc() {
$.ajax({
type: 'POST',
url: 'APUC',
data: 'productName=' + productName,
dataType: 'html',
cache: false,
success: function (result) {
document.getElementsByClassName("tilting")[0].innerHTML="<button type="button">Reload Game</button>";
},
});
}
If you are using pure Ajax, try it like this:
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementsByClassName("tilting")[0].innerHTML="<button type="button">Reload Game</button>";
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
}
I have two select boxes in my form.when a user select an option of first select box the options of second select box will be shown by jquery ajax.My problem is that some options of first select box has no record in database and when they selected the second select box should not be shown.I need to check if the data is empty .I treid this code but nothing happens
view:
<script type='text/javascript'>
$(document).ready(function(){
$('#subsec').hide();
$('section').change(){
var sec_id=$(this).val();
var url='article_controler/get_options/'+sec_id;
$.ajax({
url:url,
type:'post',
success:function(resp){
if(!resp)
$('#subsec').hide();
else
$('#subsec').show();
$('$subsec').html(resp)
})
}
});
</script>
you can try this
$.ajax({
url:url,
type:'post',
success:function(resp){
if(resp == "" || resp == null){
$('#subsec').hide();
}
else {
$('#subsec').show();
$('#subsec').html(resp);
}
})
}
});
I have added inline comments to help you out
class Article_Controller extends CI_Controller
{
public function get_options()
{
$option = $this->input->post('option'); // validate this
//Get a list of Sub options from your model
$model = ''; //your own implementation here
//If no model data returned, send a 404 status header
//and bail
if(!$model){
return $this->output->set_status_header(404);
}
$responce = array(
'suboptions' => $model // array of suboptions the model returned
);
// Ideally Abstract all the Ajax stuff to
// its own controller to keep things Dry
return $this->output
->set_status_header(200)
->set_content_type('application/json')
->set_output(json_encode($responce));
}
}
-
//Global URL variable or put it in <base href>
var URL = "<?php echo site_url();?>";
(function($){
var myForm = {
init : function(){
//initialize myForm object properties here
this.Form = $("form#myFormID");
this.selectChange = this.Form.find("select#mySelectBoxI");
this.newSelect = this.Form.find("select#secondaryselectboxId");
//hide second select with CSS by default
//Bind the Change event to our object(myForm) method
this.selectChange.on('change', $.proxy(this.ChangedEvent, this));
},
ChangedEvent : function(event){ // gets the change event
//Grab the currentTarget(option[i]) value from the event received
//You may also need to pass the CSRF Token
this.buildAjaxRequest({'option' : event.currentTarget.value});
},
buildAjaxRequest : function( data ){
var config = {
cache : false,
url : URL + 'article_controller/get_options',
method : 'POST',
data : data, //'option' : event.currentTarget.value
dataType : 'json'
};
this.makeAjaxRequest(config).then(
$.proxy(this.ResponceHandler, this),
$.proxy(this.ErrorHandler, this)
);
},
makeAjaxRequest : function( config ){
return $.ajax( config ).promise();
},
ResponceHandler : function( data ){
$.each(data.suboptions, function(i, v){
this.newSelect.append('<option value="'.data[i].'">'.data[v].'</option>');');
});
this.newSelect.show();
},
ErrorHandler : function(xhr, statusText, exception){
switch(xhr.status)
{
case 404: //remember the 404 from the controller
alert(xhr.statusText); //handle your own way here
break;
}
},
}
myForm.init();
}(jQuery));
Hi pls try this,
<script type='text/javascript'>
$(document).ready(function(){
$('#subsec').hide();
$('#firstSelectBoxId').change("selectboxMethod");
});
function selectboxMethod(){
var sec_id=$("#firstSelectBoxId").val();
alert("Selected from first select"+sec_id);
if(sec_id != null){
var url='article_controler/get_options/'+sec_id;
$.ajax({
url:url,
type:'post',
success:function(resp){
$('#subsec').show();
$('#subsec').html(resp);
}
});
}else{
$("#subsec").hide();
}
}
</script>
I have been stuck at this problem for a whole day. What im trying to do is to send 2 values from view to controller using Ajax.
This is my code in hot_products view:
<script>
$(function(){
$('#btnSubmit').click(function() {
var from = $('#from').val();
var to = $('#to').val();
alert(from+" "+to);
$.ajax({
url: "/orders/hot_products",
type: 'POST',
data: {"start_time": from, "end_time": to,
success: function(data){
alert("success");
}
}
});
});
});
and my hot_products controller:
public function hot_products()
{
if( $this->request->is('ajax') ) {
$this->autoRender = false;
//code to get data and process it here
}
}
I dont know how to get 2 values which are start_time and end_time.
Please help me. Thanks in advance.
PS: im using cakephp 2.3
$this->request->data gives you the post data in your controller.
public function hottest_products()
{
if( $this->request->is('ajax') ) {
$this->autoRender = false;
}
if ($this->request->isPost()) {
// get values here
echo $this->request->data['start_time'];
echo $this->request->data['end_time'];
}
}
Update
you've an error in your ajax,
$.ajax({
url: "/orders/hot_products",
type: 'POST',
data: {"start_time": from, "end_time": to },
success: function(data){
alert("success");
}
});
If you method is POST:
if($this->request->is('ajax'){
$this->request->data['start_time'];
$this->layout = 'ajax';
}
OR
public function somefunction(){
$this->request->data['start_time'];
$this->autoRender = false;
ANd if method is GET:
if($this->request->is('ajax'){
$this->request->query('start_time');
$this->layout = 'ajax';
}
OR
public function somefunction(){
$this->request->query('start_time');
$this->autoRender = false;
I m really new working with JQuery and I have an error in my code. The next piece of code was working perfect when a user click a "Button", it load a file in a content div.
$(document).ready(function() {
$('.Button').click(function() {
var href = $(this).attr('href');
if( typeof href != "undefined" && href != ""){
$.ajax({
url: href,
dataType: 'text',
success: function(data) {
$('#content').html(data);
ultXML = href;
}
});
}
});
});
But now I m trying to use JQuery Form plugin (with this example http://www.malsup.com/jquery/form/) And it doesnt work (the ajaxForm call), I cant understand how to merge the next code in my orignal code. I try many ways, for example making 2 ready function but it also doesnt work,
$(document).ready(function() {
// bind 'myForm' and provide a simple callback function
$('#myForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
});
Where I must put the next piece of code in my original ready function? How can meger both?
$('#myForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
Like this, work?
$(document).ready(function() {
$('.Button').click(function() {
var href = $(this).attr('href');
if( typeof href != "undefined" && href != ""){
$.ajax({
url: href,
dataType: 'text',
success: function(data) {
$('#content').html(data);
ultXML = href;
}
});
}
});
$('#myForm').ajaxForm(function() {
alert("Thank you for your comment!");
});
});
i want to redirect form after ( success ) to another page. i use this code
$(document).ready(function(){
$("#ajax-form").submit(function(){
$.post(
"ajaxContact/ajax-register.php",
$("#ajax-form").serialize(),
function(data){
if (data.success)
$("span#ajax-message").css({'color':'green'});
window.location("index.html");
else
$("span#ajax-message").css({'color':'red'});
$("span#ajax-message").html(data.message);
},
"json"
);
return false;
});
});
how to redirect.
Regards
If you want to just redirect the page there, this should work:
if(data.success)
window.location = "url";
Updated:
$(document).ready(function()
{
$("#ajax-form").submit(function()
{
$.post("ajaxContact/ajax-register.php", $("#ajax-form").serialize(),
function(data)
{
if (data.success)
{
//If successful...
window.location = 'http://www.google.com';
}
else
{
//If unsuccessful...
alert("Post was unsuccessful.");
}
},"json");
return false;
});
});
That should work for you as long as your post is returning successfully. Here's a demo using a confirm to imitate your Post:
Demo here
window.location = "http://www.google.com";