AJAX

12K

Solutions

7K

Contributors

Asynchronous JavaScript and XML (AJAX) is a group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. With AJAX, web applications can send data to and retrieve from a server asynchronously (in the background) without interfering with the display and behavior of the existing page. HTML and CSS can be used in combination to mark up and style information. The Document Object Model (DOM) is accessed with JavaScript to dynamically display and allow interaction with the information presented.

Share tech news, updates, or what's on your mind.

Sign up to Post

I have a REST call using jQuery Ajax and it works fine on every browser except for IE11.  When I make this POST call,  I get back a 400 error and the data doesn't get written.

Any advise on this would be greatly appreciated.
0
Free Tool: Subnet Calculator
LVL 9
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

in my partial view, I have used some jquery code for submitting my form.but I got this error.
The required anti-forgery form field"__RequestVerificationToken"
is not present. as you see I have added @Html.AntiForgeryToken() in my partial view and as well I have added [ValidateAntiForgeryToken] on my controller. but I got the error again.I have read all of the questions on the internet but they couldn't help me.

@model Dentistry.Areas.ViewModels.UserViewModel

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
    </button>
    <h4 class="modal-title custom_align" id="Heading">ویرایش کاربران</h4>

</div>

@if (Model != null && Model.UserId != string.Empty)
{
    <div class="modal-body" id="editModal">
        <form id="#myForm">
          @Html.AntiForgeryToken()
            <div class="form-group">
                @Html.HiddenFor(a => a.UserId)
            </div>
            <div class="form-group">
                <label>نام کاربری</label>
                @Html.TextBoxFor(a => a.UserName, new { @class = "form-control" })
                @Html.ValidationMessageFor(a => a.UserName)
            </div>
            <div class="form-group">
                <label>نام</label>
                @Html.TextBoxFor(a => a.FirstName, new { @class = "form-control" })
                @Html.ValidationMessageFor(a => a.FirstName)
          

Open in new window

0
I am having a situation where I am using the HtmlPushpin and everything is working create UNTIL I need to do a code-behind call. 

When that is done and it returns the HtmlPushpin object does not exist. 

What options do I have a that point? AJAX? But I need to keep the object on the JavaScript. Much like the Microsoft.Maps.Map object persists.

I am initially registering the module when the map is loaded with the key with the:
Microsoft.Maps.registerModule('HtmlPushpinLayerModule', '../js/HtmlPushpinLayerModule.js');

And when I have another code behind process execute and it returns back it's trying to use the HtmlPushPin object. It's obviously no longer present and I get an "HtmlPushpin is undefined" message. 

Are there any options...can I load the module from the code-behind? 

Any information would be greatly appreciated!
0
I have been messing around creating an Ajax application using OpenSUSE, MariaDB, php and Firefox.   I had most of it working but now i can not get it to process the returned xml from my php application  

I have walked through the code using firebug and when i get to  xmlHttp.onreadystatechange = handleStatus(lineID);   handleStatus is called but after xmlHttp.send(null);  I just execute the next line (just a filler to set a breakpoint) and then exit the function, handleStatus is not called so I don't process the xml.  

If I examine the xmlHttp object it shows xmlHttp.readyState is 4 and the xml returned from chInfo.php

I have checked the error logs and there are no issues with my PHP code.  It just does a read of a database table, builds the xml and returns it.  

<?xml version="1.0" encoding="UTF-8" standalone="yes"?><response><subBox><name>sub4</name></subBox><lines><select><ID>24</ID><desc><line1<desc></select></lines><response>

Any ideas on what I have done wrong?
Ajax1.txt
0
Hi,
I am making a http patch request using an  ajax call on chrome to url - https://api.github.com/repos/owner...
My page url is localhost:8080.
This call is failing. In the network tab i see an option request being made in red.
I read some places that patch request that  is cross origin will be preflighted.
Which i think means that it will be first checked with github that patch is allowed in cross origin.
But github docs says its open to cross origin request.
How do i achieve my goal ?
Also please mention some good video or articles on cross origin / preflight etc.

Thanks
0
I've actually been able to get this working on the editor in pages and posts using the code below. But haven't been able to get it to work for the new editor added to text widgets. I read that wordpress is using jQuery now for those text widgets, but even trying this without a hook, just adding the script sitewide to test doesn't work:

<script type="text/javascript">
jQuery( document ).on( 'tinymce-editor-setup', function( event, editor ) {
    if ( editor.settings.toolbar1 && -1 === editor.settings.toolbar1.indexOf( 'blockquote' ) ) {
        editor.settings.toolbar1 += ',blockquote';
    }
});
</script>

Open in new window


I tried that just to see if the new method wordpress says you can use to add more buttons would even affect the editor in the text widget, but it doesn't even add the blockquote icon as expected. So of course I can't poke around to try to figure out what would target the link option.

This is the code that does work for the editor in pages and posts:
<?php
function newtablink()
{
 ?>
<script type="text/javascript">
    jQuery(function () {
       jQuery('input#wp-link-target').prop('checked',true);
    });
</script>  
<?php
}

add_action( 'before_wp_tiny_mce', 'newtablink' );
?>

Open in new window


Anyone have any thoughts or suggestions on how to go about this for the widget? Below is a screenshot for a visual of where and what I'm trying to work with.
(If you wonder why we want to do this: we have some sites that have more external links than internal. So we want the people adding or editing content or widgets to be able to just enter the url without having to open in extra settings box. We don't want to add a plugin that automatically tries to auto add the target="_blank" as pages render because we want to still have individual control. Some of the people editing have very limited skills, so we want to try to simplify anything we can for some of the sites.)

Screenshot of the box that opens when adding a link in the editor.
0
Hello,

I have piece of code here. I am trying to create something like a quiz application. In  <h4>Add question</h4> part, I can add a question if I want to and I store all the details I entered into the database by making an ajax call. Upon success, this piece of code gets replaced by the same code with other data so that the user can enter all the details. What I am trying to do is once I add a question in 'Add question' part, then I should be able to display it throughout the quiz. How can I do a post for new_questions in ajax and send it to the controller?

Can anyone suggest me how to do proceed with this?

Any kind of suggestion would be helpful.
   
<?php
foreach($substeps as $row) {
 ?>
 <div id='img_div'>
      <h2 id="stepslist_<?php echo $row->stepid;?>" class="step"><p><?php echo $row->stepname;?></p></h2>
      <img src='http://localhost/project/uploads/<?php echo $row->image; ?>'>
</div>
<?php } ?>
 <?php
      foreach($questions as $each){
      ?><br><br>
      <input type="text" name="questions[]" class='form-control' id="questions_<?php echo $each->questionid; ?>"  value="<?php echo $each->questionname; ?>" disabled/><br/>
   
    <h4>Add question</h4>
    <input type="text" class="form-control" name="newquestion[]"  id="new_questions_<?php echo $each->questionid; ?>" /><br>
    <h4>Answer:</h4>  <select class="form-control" name="answer[]" id="answer" required>
 <option value="">Select</option>
 <option value="no">no</option>
 <option 

Open in new window

0
My sample site URL : My working Site URL

I am trying to find a solution that will allow me to plot the GPS coordinates of many moving objects "live" on a Google Map.

The GPS coordinates of each object will constantly be updating into a MySQL database, and I'd like to know whether it is possible to read each updated coordinate, maybe once every couple of seconds, and re-plot the marker coordinates on the Google Map, without the user having to refresh the page.  Can this be done,?

would it also be possible to make each marker different, and each marker clickable to get more information on the particular object?

My map based on Jack Dougherty's FusionTable-Map-2-layers Template and running nicely on my hostgater server.

I have Traccar Open Source GPS Tracking Platform hosted with Amazone AWS and able to get tracker data to the mysql database, this database update every 30 second with live tracker data

# my db name “newTraccar” & all tracker data update for table `positions`

// -------------- Table structure for table `positions` ---------------------//

CREATE TABLE IF NOT EXISTS `positions` (
  `id` bigint(20) NOT NULL,
  `address` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
  `altitude` double DEFAULT NULL,
  `course` double DEFAULT NULL,
  `latitude` double DEFAULT NULL,
  `longitude` double DEFAULT NULL,
  `other` 

Open in new window

0
// Cotroller
[HttpPut]
        public HttpResponseMessage Put([FromUri]string oldPwd, [FromBody]Hotel_Login Hotel_Login)
        {
            using (Hotel_ShowEntities entities = new Hotel_ShowEntities())
            {
                try
                {
                    var entity = entities.Hotel_Login.FirstOrDefault(e => e.Password == oldPwd);
                    if (entity == null)
                    {
                        return Request.CreateErrorResponse(HttpStatusCode.NotFound, "Customer with that Password=" + oldPwd.ToString() + "not found");

                    }
                    else
                    {
                        entity.Password = Hotel_Login.Password;
                        entities.SaveChanges();
                        return Request.CreateResponse(HttpStatusCode.OK, entity);
                    }
                }
                catch (Exception ex)
                {
                    return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
                }
            }

        }

//Ajax call

 $(document).ready(function () {
                $("#btnSubmit").click(function () {
                    var CurrentPwd = $("#CurrPwd").val();
                    var Newpwd = $("#NewPwd").val();
                    console.log(Newpwd);
                    $.ajax({
                        type: "Put",
                        url: "http://localhost:16580/api/ChangeForgetPass/Put?oldPwd=" +…
0
I have a user form that is created in extjs framework. The user form has many user fields which are being passed as part of request payload to the REST controller. I am trying to add a grid panel(most likely in a tabular format with multiple rows & columns) to the user form. But I am not sure how to pass the grid panel data as part of request payload to the REST controller. I will post more code if any more details are needed. Any help would be appreciated. Thanks.

Ext.define('soylentgreen.view.admin.UserForm', {
    extend : 'Ext.form.Panel',
    alias : 'widget.userform',
    bodyStyle : 'padding:5px 5px 0',

// some userform elements like firstname,lastname, go here.....

name : 'userTeamGrid',
  xtype : 'gridpanel',
id : 'userTeamGrid',
itemId : 'userTeamGrid',
multiSelect : true,
selModel : Ext.create(
        'Ext.selection.CheckboxModel',
        {
          injectCheckbox : 'first',
          mode : 'MULTI',
          checkOnly : false
        }),
anchor : '100%',
width : '700px',
height : 250,
flex : 1,
store : 'userTeamStore',

var user = form.getRecord();
form.updateRecord(user);
user.save({
        callback : function(records, operation){
          //reset the (static) proxy extraParams object
          user.getProxy().extraParams =  {
            requestType: 'standard'
          }
          if(!operation.wasSuccessful()){
            var error = operation.getError();
0
Ready to get started with anonymous questions?
LVL 9
Ready to get started with anonymous questions?

It's easy! Check out this step-by-step guide for asking an anonymous question on Experts Exchange.

In my wordpress site, Ajax Load more plugin is not working for the specific page. Itz working in some of the pages. But not working in the rest of the pages. Below are the urls that can give you a clear description.
Working Page : "http://www.stockimagesafrica.com/people"
And not working in http://www.stockimagesafrica.com/downloads/category/southern-africa/
0
Hello All;

OK, this is code that I found a while back, and posted here.
ASP Classic - Insert text, Line breaks and Code

The issue that I had, or am still having now, is that I am giving the user the option to choose the tags they want to use.
They can have as many tags as they need in their post.

The issue with the code in the link above is that it will only do one tag hard coded.
So, that I have done is added an REGGEX into it, and it works GREAT! for the highlighting,
However, adding this in, has messed up the main function of this code FUNCTION, and that is.
It adds the line breaks to everything OUTSIDE of the Code tags.

The REGGEX that I used and works is this.

Function Reggex(strString, strPattern, strReplace)

	Dim RE: Set RE = New RegExp

	With RE
		.Pattern = strPattern
		.Global = True
		.IgnoreCase = True
		Reggex = .Replace(strString, strReplace)
	End With
	
End Function

fString =   Reggex(fString, "\[code=(.*?)\](.*?)\[\/code=(.*?)\]", "<pre class=""line-numbers"" id=""code""><code class=""language-$1 demo"">$2</code></pre id=""code"">")

Open in new window


The original code is this. (Modified to work in my project)

 	CodeTags(1,1,1) = "[ code=sql]" ' Remove the space between the bracket, 
 	CodeTags(1,2,1) = "[/ code=sql]" ' Remove the space between the bracket, 
 	CodeTags(1,1,2) = "<pre class=""line-numbers"" id=""code""><code class=""language-sql demo"">"
 	CodeTags(1,2,2) = "</code></pre id=""code"">"

Open in new window


This is the entire script.


Open in new window

0
Hi ,

I am using masterpage and masterpage is having Ajax ModalPopupExtender Control. Also page uses Frames. ModalPopup shows always in the top frame and top frame is greyed out. Bottom frame is not greyed out. how to to show modalpopup window in the center of the page and both frames are greyed out.

Masterpage.aspx
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="AdminMasterPage.master.cs" Inherits="CoreTeamFeedback.Administration.MasterPage" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

   <asp:ContentPlaceHolder id="head" runat="server">
   </asp:ContentPlaceHolder>
<style>
 .modalBackground

    {
        background-color: #cccccc;
        filter: alpha(opacity=50);
        opacity: 0.6;
    }

    .modalPopup
    {
        background-color: #FFFFFF;
        width: 300px;
        border: 3px solid #507F70;
        border-radius: 12px;
        padding:0
    }

    .modalPopup .header
    {
        background-color: #285C4D;
        height: 30px;
        color: White;
        line-height: 30px;
        text-align: center;
        font-weight: bold;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        font-family:Verdana;
        font-size:8pt;
    }

    .modalPopup .body
    {
  

Open in new window

0
Oh the wonderful MVC world....

I am trying to setup a timeout script for my website. Currently it seems to work but if the user wanted to extend the timeout time then move to another page it seems to have lost all of my session varibles I had saved.

FilterConfig.cs code:
public class IsAuthenticatedAttribute : ActionFilterAttribute  
    {  
        public override void OnActionExecuting(ActionExecutingContext filterContext)  
        {  
            if (rowCnt >= 1) //Making sure user has permissions to even view this site  
            {  
                System.Diagnostics.Debug.WriteLine("Current timeout: " + HttpContext.Current.Session.Timeout);  
                System.Diagnostics.Debug.WriteLine("Session timeout: " + HttpContext.Current.Session["timeoutDate"]);  
  
                if (HttpContext.Current.Session.Timeout == 20) //20 is the default timeout setting  
                {  
                    //It's the first time the user has visited the page so set timeout!  
                    filterContext.HttpContext.Session.Clear();  
                    filterContext.HttpContext.Session.RemoveAll();  
  
                    HttpContext.Current.Session.Timeout = 1;  
                    HttpContext.Current.Session["sessionVars"] = new initSessionVars().getSVars;  
                    sessionVars sVars = HttpContext.Current.Session["sessionVars"] as sessionVars;  
  
                    //Send them to the main page in order to populate the sessions and 

Open in new window

0
<script>
  function myFunction() {
     var query = '?';
     var str = $("form").serialize();
     $("#results").text(query += str);
     var x = $("#results").text();
     return x;
 }
  $( "input[type='sel'], input[type='text']").on( "click", myFunction);
  $( "select" ).on( "change", myFunction);

  //window.alert(myFunction());
 //query += '&' + value + '=' +  value +'.value';
 var jsonString = JSON.stringify(myFunction());
 console.log(jsonString);
 $.ajax({
    url: 'insert_value.php',
    data: jsonString,
    
    contentType: 'application/json; charset=utf-8',
    type: 'POST',
  }).done(function(resp) {
    $('#result').html(resp)
  });
  
</script> 
    

Open in new window




This is not showing values on the console only "?Gender=Male&id=" after editing values on the controls it is not changing values and giving above message on the console it giving something like this   [Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive.
0
we are generating dynamic controls like dropdown and textboxes so how we need to get data and assign those values to array and creating query string and pass that to one variale using ajax
please let me know the answer for this question
dyn_html.php
0
Hello,

I have spent about 10 hours trying to figure this out.

So this form worked on another server 2 days ago, I moved it to a new server and now the form will not submit. I tried to look if there were any errors but no errors are recorded.

I am afraid that I don't have the correct tools, can someone that is familiar with js take a look and see if they see where the error is being reported, I am assuming there is a way to check it in the browser.

http://tinyurl.com/mux3tml

Thanks!
0
JS on child page:
GetRadWindow().BrowserWindow.refreshGrid(args); ---Does not refresh the grid on the master page.

vb on child page:
 Protected Sub DetailsView1_ItemCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DetailsViewCommandEventArgs) Handles DetailsView1.ItemCommand
        If (e.CommandName = "Update") Then
            ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind();", True)
        ElseIf (e.CommandName = "Insert") Then
            ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CloseAndRebind('navigateToInserted');", True)
        Else
            ClientScript.RegisterStartupScript(Page.GetType(), "mykey", "CancelEdit();", True)
        End If

    End Sub

Open in new window

0
Dear All,
I have a textbox in a asp.net web page .
When the user click inside the textbox I need to open a panel that contain 3 textboxes and a confirm button.
the user will then b able to write in these 3 textboxes(with jquery autocomplete) and I will concatenate the strings to a final string in the parent textbox.
I tried to use a ajaxtoolkit:PopupControlExtender and it did the trick but it will close every time the user select an option from the autocomplete. Any Idea how to keep this popup opened after selection done and close it only when confirm button click?
0
What does it mean to be "Always On"?
LVL 4
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

ColdFusion CFSelect will not bind and return the Selected Value in ColdFusion 11.... It works fine in ColdFusion 8 and 9, but when put on CF11 it will not work

Here is the code.

<cfselect name="Field1" id="Field1" value="" bind="cfc:cfc_Field1DrillDown.lookupField1({Field1Desc},'#vField1Category#')" bindonload="YES" />

The CFC:

<cfcomponent output="false">
      
      <!--- Lookup used for auto suggest --->
      <cffunction name="lookupField1" access="remote" returntype="array">
            <cfargument name="vField1Desc" type="string" required="true">
            <cfargument name="vField1Category" type="string" default="" required="false">
            <!--- Define variables --->
          <cfset var data="">
          <cfset var result=ArrayNew(2)>
          <cfset var i=0>
            
            <!--- Do search --->
            <cfquery datasource="#Request.FieldDSN#" name="data">
                  SELECT QueryFieldID, QueryField
                  FROM FieldNames
                  WHERE (SICDefinitionID = '#ARGUMENTS.vField1Desc#')
                  ORDER BY QueryField
            </cfquery>
            
            <cfif data.recordcount IS 1>
                    <cfset result[1][1]=data.QueryFieldID>
                      <cfset result[1][2]=data.QueryField>
                        <cfset result[1][3]=IIF(ARGUMENTS.vField1Category eq data.QueryFieldID,DE(true),DE(false))>
            <cfelse>
                  <cfset result[1][1]="N/A">
                <cfset result[1][2]="">
                  <cfloop index="i" from="1" to="#data.RecordCount#">
                    <cfset result[i+1][1]=data.QueryFieldID[i]>
                        <cfset result[i+1][2]=data.QueryField[i]>
                        <cfset …
0
When a site is  using jquery/XMLhttp requests we were able to get active ajax calls in the back end using "jQuery.active".
But when a site is using Aurelia fetch for ajax calls(Fetch complete: POST), how to get number of active fetch calls in the back end?
0
Hi mates,

I have written an app built around JSON object and ajax though with PHP.

This one is using WebMethod() with asp.net and I am running into "error while inserting data"

Though that is my custom error message, it tells me there is an issue with sanitizing data.

I am also receiving [object Object] which tells me that a certain form field is not getting stringrified.

Can someone please help?

    <script type="text/javascript">
        $(document).ready(function () {
            $(document).on("click", "#btnAdd", function () { //
                var rowCount = $('.data-contact-person').length + 1;
                var contactdiv = '<tr class="data-contact-person">' +
                    '<td><input type="text" style="width:200px;" name="sourcename' + rowCount + '" class="form-control sourcename01" /></td>' +
                    '<td><input type="text" style="width:200px;" name="sourceaddress' + rowCount + '" class="form-control sourceaddress01" /></td>' +
                    '<td><input type="text" style="width:200px;" name="sourceincome' + rowCount + '" class="form-control sourceincome01" /></td>' +
                    '<td style="width:200px;"><button type="button" id="btnAdd" class="btn btn-xs btn-primary classAdd">Add More</button>' +
                    '<button type="button" id="btnDelete1" class="deleteContact btn btn btn-danger btn-xs">Remove</button></td>' +
                    '</tr>';
                $('#maintable').append(contactdiv); //

Open in new window

0
I have got DropZoneJs working to upload multiple images, store them in a specified location and add records to the database.

The problem I am facing now is how to add javascript/jquery to call the php file that I want to be responsible for deleting database records and removing files. The code I found for removing uploaded images was on the DropzoneJs website but this just removes the visible image on the screen, nothing else.

They have commented below where you should make the ajax call but I don't know how. I am guessing that I need to pass the images ID's to the php page which will perform the delete.

Dropzone.options.imageUpload = {
			init: function () {
				this.on("addedfile", function (file) {
					// Create the remove button
					var removeButton = Dropzone.createElement("<button class='btn btn-fill btn-danger'>Remove file</button>");
					// Capture the Dropzone instance as closure.
					var _this = this;
					// Listen to the click event
					removeButton.addEventListener("click", function (e) {
						// Make sure the button click doesn't submit the form:
						e.preventDefault();
						e.stopPropagation();
						// Remove the file preview.
						_this.removeFile(file);
						// If you want to the delete the file on the server as well,
						// you can do the AJAX request here.
						this.on("maxfilesexceeded", function(file) { this.removeFile(file); });
					});
					// Add the button to the file preview element.
					

Open in new window

0
I have inherited a SharePoint site that has a mix of SPServices calls and .aJax calls to obtain list data.  Can anyone suggest why a mix?  Also,  I am looking into converting the calls which are 100% async false to async true.  Can I handle the two call types .ajax and spServices the same with regards to that?  I am aware that I need to use promises or some mechanism to ensure that the call has completed and that page has had required updates performed before I make any subsequent calls to functions which need to process the page once its in its "next" state.
0
I had this question after viewing how to clear Browser cache using angularjs.

we are retrieving by using ajax call to server.Then we are assigning them by using model of angular JS.
This caching is only happening with Internet explorer version 11/10/Edge
0

AJAX

12K

Solutions

7K

Contributors

Asynchronous JavaScript and XML (AJAX) is a group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. With AJAX, web applications can send data to and retrieve from a server asynchronously (in the background) without interfering with the display and behavior of the existing page. HTML and CSS can be used in combination to mark up and style information. The Document Object Model (DOM) is accessed with JavaScript to dynamically display and allow interaction with the information presented.