error when using if condition in Ajax code - ajax

I want to change var Rs on value Price field
some data fields have price and some don't there for I need to change that logically
I want to change var Rs on value Price field
some data fields have price and some don't there for I need to change that logically
<script type="text/javascript">
$(document).ready(function($){
AllAddData();
function AllAddData(query = '') {
$("#Published").empty();
$.ajax({
url: 'AllAdds',
type: 'GET',
datatype:'html',
data:{SearchKey:query},
})
.done(function(data) {
$.each(data, function(index, val) {
if(!empty(val.Price)){
var Rs ="{{ __('Rs.') }}"+val.Price;}
else{var Rs ="";}
});
})
.fail(function()
{
alert("fail")
console.log("error");
})
}
$(document).on('keyup', '#search', function(){
var query = $("#search").val();
//alert(query);
AllAddData(query);
});
});
</script>

var Rs = !(val.Price) ? "" :"{{ __('Rs.') }}" + val.Price

Related

checking if the success data is empty in ajax method of jquery

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>

Alert an array value that results from an AJAX call

I am having some difficulty trying to alert a value which is the result of an ajax call. The code below is working to the extent that grid.onClick will alert the value of row, but for the life of me I cannot figure out how to alert the value of latitude and/or longitude.
function showGridSalesResult(){
var data = [];
var r_from = $('#min_val').val();
var r_to = $('#max_val').val();
var p_from = $('#from_year').val();
var p_to = $('#to_year').val();
var type = $('#sf3').val();
var municipality = $('#SaleCity').val();
$(document).ready(function(){
jqXHR = $.ajax({
url: sURL + "search/ajaxSearchResult",
type: "POST",
data: 'r_from='+r_from+'&r_to='+r_to+'&p_from='+p_from+'&p_to='+p_to+'&type='+type+'&up_limit='+up_limit+'&low_limit='+low_limit+'&municipality='+municipality,
dataType: 'json',
success: function(json){
$.each(json, function(i,row){
data[i] = {
address: row.Address,
municipality: row.Municipality,
geoencoded: row.geoencoded,
latitude: parseFloat(row.geolat),
longitude: parseFloat(row.geolong)
};
});
grid = new Slick.Grid("#myGridMap", data, columns, options);
grid.invalidate();
grid.render();
grid.resizeCanvas();
grid.onClick = function (e, row, cell){
alert(row); // THIS WORKS
alert(data[row].latitude); // THIS DOES NOT WORK
}
setMarkers(map, data);
}
});
});
}
Can someone please help me to figure out how I can alert the latitude and longitude values?
Checking the documentation :
https://github.com/mleibman/SlickGrid/wiki/Slick.Grid#wiki-getCellFromEvent
you should use :
var cell = grid.getCellFromEvent(e);
var latitude = data[cell.row].latitude;
alert(latitude);

jquery datatables fnAddData from dialog form ajax not working

I have a datatable defined at document ready as follows
$(document).ready(function() {
var oTable = $('#systemgoals').dataTable({});
I have a dialog with form and a button with the following function
buttons: {
"Add System Goal": function() {
var formfilled = true;
$("form#add_systemgoal :text, form#add_systemgoal :file, form#add_systemgoal :checkbox, form#add_systemgoal select, form#add_systemgoal textarea").each(function() {
if($(this).val() === "")
formfilled = false;
});
if(formfilled === true){
$('form#add_systemgoal .error').remove();
var formdata = $('form#add_systemgoal').serialize();
$.ajaxSetup({async: false});
$.ajax({
type: "POST",
url: '/admin/systemgoals/systemgoalupdate?format=html',
data: formdata,
success: function (data) {
var obj = $.parseJSON(data);
if(obj.success){
$(oTable).dataTable().fnAddData( [
obj.inserted.goal_id,
obj.inserted.value,
obj.inserted.status,
obj.inserted.points_per_action,
obj.inserted.created,
obj.inserted.due,
obj.inserted.expires ]);
}
}
});
}
the ajax is fine the form posts the correct values respond but the fnAddData returns error
ReferenceError: oTable is not defined
Any advice appreciated
thank you
You didn't set your oTable as a global variable that why oTable on your dialog is not define, if you want to define it on your script do something like:
var oTable;
$(document).ready(function() {
oTable = $('#systemgoals').dataTable({});
And on your dialog
oTable.fnAddData( [
obj.inserted.goal_id,
obj.inserted.value,
obj.inserted.status,
obj.inserted.points_per_action,
obj.inserted.created,
obj.inserted.due,
obj.inserted.expires ]);
}
or just simply do
var oTable = $('#systemgoals').dataTable().fnAddData...
Best Regards

how to make ajax call in Jquery's delegate()

I have a delegate function of JQuery to remove a row of a grid which is anchor tagged remove, as below
$('#MyGrid').delegate('a.remove', 'click', function() {
// e.preventDefault();
var tr = $(this).closest('tr');
var htmlstring = tr.find("td").eq(0).html();
alert(htmlstring);
jQuery.ajax( //$.ajax( also not working
{
type: "POST",
url: "UploadDocuments/Removefile",
data: "removefile=" + htmlstring,
success: function(){
tr.remove();
}
});
});
this is where i am making delegate call in success function of JQuery
success: function(result) {
var htmlString = [result];
for (i = 0; i < htmlString.length; i++) {
$('#MyGrid tbody').append('<tr><td>Remove</td></tr>');
}
},
Now i want to make ajax call as shown but it is not hitting once i click remove ,but is loading initially.Also i need to pass the data i.e the name of the deleted row.How can i get that value?
could any of you guys help me out! got stucked !! ;)
thanking you,
michaeld
Try this where IndexOfNameColumn points to the name column index.
$('#MyGrid').delegate('a.remove', 'click', function() {
// e.preventDefault();
var tr = $(this).closest('tr'); //line#3
var htmlstring = tr.find("td").eq(IndexOfNameColumn).html();
jQuery.ajax( //$.ajax( also not working
{
type: "POST",
url: "UploadDocuments/Removefile",
data: "removefile=" + htmlstring //file name from line#3
});
tr.remove();
});
try this code-
$('#MyGrid').delegate('a.remove', 'click', function() {
// e.preventDefault();
var tr = $(this).closest('tr').find("td").eq(0).find('a').text().replace(/"/g,"").trim(); //line#3
var $this = $(this);
jQuery.ajax(
{
type: "POST",
url: "UploadDocuments/Removefile",
data: "removefile=" + tr //file name from line#3
success: function(){
$this.closest('tr').remove();
}
});
});

ajaxComplete function "loader" running once

here is the code I'm using:
$(function() {
$(".fav").click(function() {
var page = $('#page').attr('value');
var user = $('#user').attr('value');
var time = $('#time').attr('value');
var info = "page="+ page +"& user="+ user +"& time="+ time;
$("#loading").html('<im g src="loader.gif" />');
$.ajax({
type: "POST",
url: "favorite.php",
data: info,
success: function() {
$("#loading").ajaxComplete(function(){}).slideUp();
$('#fav').fadeOut(200).hide();
$('#unfav').fadeIn(200).show();
}
});
return false;
});
});
</script>
<script type="text/javascript" >
$(function() {
$(".unfav").click(function(){
var page = $('#page').attr('value');
var user = $('#user').attr('value');
var info = "page="+ page +"& user="+ user;
$("#loading").html('<im g src="loader.gif" />');
$.ajax({
type: "POST",
url: "notfavorite.php",
data: info,
success: function(){
$("#loading").ajaxComplete(function(){}).slideUp();
$('#unfav').fadeOut(200).hide();
$('#fav').fadeIn(200).show();
}
});
return false;
});
});
Everything is working fine, it acts as a "like" "follow" button, the only problem is that the ajaxComplete() function only runs once.
Cheers!
$(function(){
$(".fav").click(function(){
var page = $('#page').attr('value');
var user = $('#user').attr('value');
var time = $('#time').attr('value');
var info = "page="+ page +"& user="+ user +"& time="+ time;
$("#loading").html('<im g src="loader.gif" />');
$('#follow').hide();
$.ajax({
type: "POST",
url: "favorite.php",
data: info,
success: function(){
$('#loading').empty();
$('#remove').fadeIn(200).show();
}
});
return false;
});
})();
same for .unfav

Resources