AJAX

12K

Solutions

13

Content

i
The collection of articles, videos, and posts on this topic.

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 am storing image names in an array from DB and then encode it with json encode function to receive it in my ajax success method:

Here is the code"

$sql_gallery = "SELECT * FROM map_projects_gallery ";		
$gallery_result = mysqli_query($conn, $sql_gallery);
while( $gallery_row = mysqli_fetch_assoc($gallery_result) )
{					
$gallery_image_name[] = $gallery_row["img_name"];			
}		

echo json_encode(array("map_gallery" =>$gallery_image_name ));

Open in new window



Note: In ajax success function it returns all the image names. Now I want to display all images in a div and then later display them in a slider.


And here is my Code of jQuery Ajax
jQuery.ajax({
	url:"project.php",
	type: "POST",	
	data:  {"country_id":country_id,"lang_name":langname_val,"node_id":node_id,"fullurl":'<?php echo base_path();?>'},
	dataType: "json",								
	success: function(data)
	{
		alert(data.map_gallery);
		jQuery('#project-list').html(data.message1);  
	        jQuery('#paginations').html(data.message_2); 
		  
		
		  ///jQuery('.pr-cont-gallery').html('<img src=files/'+project_details.project_image+' width=200px>');	  
		  
		  jQuery('.pr-cont-gallery').append('<img src="' + data[0].map_gallery + '" />');

		  
		  data.forEach(function (data) {
				jQuery('.pr-cont-gallery').append('<img src="aaaaa.jpg" />');
		   });
	},
  });

Open in new window


Problem:  I am unable to display all images separately in a div. Need help to fix this issue
0
4 Comments
Cloud Class® Course: Amazon Web Services - Basic
LVL 12
Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

Start This Course
Here is the ajax call

function showCustomProps(){
    
    $('#subaction').val("getCustomProperties");
    var data = $('#subaction') ;
  
  
    $.ajax({
        type: "POST",
        url: 'controllers/contacts.ajax.php',
        data: data,
    }).success(function (response) {
      
        
        
        console.log(response);
        
    }).error(function (data) {
        console.log("erro customProps");
    });
    
} //showCustomProps

Open in new window


this is triggered on load.

to run this code - 

$stmt = new Database();

				$query = "SELECT cp.id, cp.name, cp.field_type 
							FROM custom_properties cp
							WHERE cp.client_id = :clientID AND cp.viewable='1' AND cp.type = '1'
							ORDER BY cp.id DESC";
				$stmt->query( $query );
				$stmt->bind( ':clientID', $clientId);
		     	$stmt->execute();
				$demo1 = $stmt->fetchAll();

				foreach($demo1 as $customResult){
					$cusData['propertyId'] = $customResult['id'];
					$cusData['propertyName'] = $customResult['name'];
					$cusData['propertyType'] = $customResult['field_type'];
				

			

				}//customresult

						$response = array(
							'subresult' => 'customProps success',
							'data' => $cusData
						
							
						);

		break;

Open in new window



Now the issue is that it is returning null.  but if i change fetchAll to all it returns a row from the database, i need this foreach to fetch all records not just the first one. if i return demo1 instead of customResult i can see there is two records, Please note i can only see this data if i use all() and when i use fetchAll it returns null.
0
3 Comments
Array = 

"<select style ='width:100%;' class='formInput' name='property'2527'' id='property'2527''><option value=''>- select -</option>"
1
:
"<option value='test1' >test1</option>"
2
:
"<option value='test2' >test2</option>"
3
:
"<option value='test3' >test3</option>"
4
:
"</select>"

Open in new window


so i then append to my html 

$("#custom-properties").append(properties.custom);

Open in new window



but the output structure is incorrect ?

html structure
any hints
0
4 Comments
Hi experts,

I'm using the Telerik UI for ASP.NET AJAX RadWindow.
https://demos.telerik.com/aspnet-ajax/window/examples/overview/defaultcs.aspx

I'm using ASP.NET and VB.

I saw this example here for passing a parameter from the Main page to the RadWindow:

Using RadWindow as a Dialog
https://docs.telerik.com/devtools/aspnet-ajax/controls/window/how-to/using-radwindow-as-a-dialog

I recreated this example and it works fine.

This is the working code:

RadWindow1_MainPage.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="RadWindow1_MainPage.aspx.vb" Inherits="RadWindow1_MainPage" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">

        // https://docs.telerik.com/devtools/aspnet-ajax/controls/window/how-to/using-radwindow-as-a-dialog

        // The OnClientShow event handler sets the argument to the dialog being opened
        function clientShow(sender, eventArgs) {
            // When the showRadWindow1 button is clicked the value from the textbox is pass to RadWindow1 as an argument
            var txtInput = document.getElementById("txtInput");
            sender.argument = txtInput.value;
        }
        // The OnClientClose event handler receives the result of the dialog and responds
        function clientClose(sender, args) {

Open in new window

…
0
5 Comments
On my localhost I don't seem to have the problem but on a live server at times when performing an ajax request that has some php querying the database, the ajax query will hang and the spinner/loader that blocks the UI will just get stuck in some infinite loop. This is obviously not good for the customer and not good for business. What is the best way to prevent this/troubleshoot this?
0
12 Comments
I have developed a website using php 7, jQuery and ajax. I have had a few people mention that the website does not work on Internet explorer. There has been no mention of what version but if they said Internet explorer then it sounds like prior to Edge. Apparently just a blank screen appears instead of the actual website. I am running a mac so don't have internet explorer to check myself. What would the best solution be? To either redirect them to a page that requests that they use a more modern browser or.... ?
0
7 Comments
JQ onclick not triggering or any event on any inputs within this container.


So i have a container with inputs now im trying to test a click event on these inputs but it isnt working and no errors and i used click hundreds of times and never had this issue,


so really simple -

$(document).ready(function() {
    $("#contact-personal-fname").click(function () {
      alert("Hello!");

    });
  });

Open in new window


which refers to this one - 

<div id = 'firstname' class=' col-md-4'>
                      <label class=' control-label' for='textinput'>First Name</label>                 
                      <input id='contact-personal-fname' name = 'FIRST_NAME'  type='text' placeholder='First name'  class='form-control input-md no-border' value='".$v_item['FIRST_NAME']."' > 
                    </div>

Open in new window


now this isnt hard coded in, it actually been passed from ajax and appended like so .

   var arrayJson = JSON.stringify(response);
        var properties = JSON.parse(arrayJson);
 $("#default-personal-properties").append(properties.personal);

Open in new window


how it looks in its array . -

personal
:
Array(16)
0
:
"↵								<div id = 'firstname' class=' col-md-4'>↵								<label class=' control-label' for='textinput'>First Name</label>                 ↵								<input id='contact-personal-fname' name = 'FIRST_NAME'  type='text' placeholder='First name'  class='form-control input-md no-border' value='Tim' > ↵								</div>↵						"
1
:
"↵↵						"

Open in new window

…
0
3 Comments
Hello Experts!
Please how can I make this login script more secure? Help me use prepare statement and if possible use Ajax to validate at client side. Thank you so much.
<?php

require '../includes/connection.php';

session_start();
$timeout = 1440; // Set timeout period in seconds

if (isset($_SESSION['start_time'])) {
    $elapsed_time = time() - $_SESSION['start_time'];
    if ($elapsed_time > $timeout) {
        header("Location: ../logout.php");
    }
}
$_SESSION['start_time'] = time();

$date_time = date("Y-m-d H:i:s");

function clean($data) {
    $data = trim($data);
    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;
}

//Login Query
if(isset($_POST['login_btn'])){

    $username = clean($_POST["username"]);
    $password = clean($_POST["password"]);
    
    $sql = "SELECT users.UserId AS UserId, users.Initials AS Initials, users.Username AS Username, users.Password AS Password, users.Role AS Role, users.ClassAssigned AS ClassAssigned, userclass.SubjectTaught AS SubjectTaught, tbl_subjects.Subject_Name AS Subject_Name, userclass.ClassTaught AS ClassTaught from ((users join userclass on((users.UserId = userclass.UserId))) left join tbl_subjects on((userclass.SubjectTaught = tbl_subjects.Subject_Code))) WHERE Username='$username'";
    $result = $conn->query($sql);

    if ($result->num_rows > 0) {

        // output data of each row
        while($row = $result->fetch_assoc()) {
            if($row['Password'] == $password

Open in new window

…
0
11 Comments
Insert into pdo table not working and no error.

$stmt = new Database();
					//check to make sure there is a record to update 
				$query = "SELECT chk_name FROM a_test WHERE charityID = :clientID AND contactID = :contactId";
				$stmt->query( $query );
				$stmt->bind( ':clientID', $clientId);
				$stmt->bind( ':contactId', $contactId );
		     	$stmt->execute();
				$result = $stmt->all();

		if($result == null){
			foreach($_POST['chkStateCollection'] as $chkState) {
				$stmt = new Database();
					//Inserting check state.
				$query = "INSERT INTO a_test (charityID, contactID, chk_name) VALUES (:clientId, :contactId :chkName) ";
				$stmt->query( $query );
				$stmt->bind( ':clientId', $clientId );
				$stmt->bind( ':contactId', $contactId );
				$stmt->bind( ':chkName', $chkState );
		     	$stmt->execute();
				$result = $stmt->all();
			}
		} else {
				$testreply = "no rows detected";
		}

Open in new window


Ok so what this code is doing and suppose to do.  I am checking to see if a record exists first and this part works as expected if record exist goto else if not then create a record.

Now the record is created with two ID which is stored in a session they seem fine. now im not sure if the last one is the issue as i tried hard coding and same response but the field chk_name is populated by the forach which gets it details from ajax post array which looks like this -

(2) ["POSTITION", "FIRST_NAME"]

Open in new window


the problem is when it gets to the INSERT it doenst add and the ajax response is not successful with not errors. so im lost on what is the issue.
0
1 Comment
When using ajax to send data over i am getting this error.

["POSTITION"]
contact.php?cid=10296&id=:3334 0
jquery-2.2.4.min.js:4 Uncaught RangeError: Maximum call stack size exceeded
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)
    at Gb (jquery-2.2.4.min.js:4)

Open in new window


How i am sending - 

$('#subaction').val("setChkState");
       var data = $('#subaction') ;

           $.ajax({
                type: "POST",
                url: 'controllers/contacts.ajax.php',
                dataType: 'json',
                data: {data:data},
            }).success(function (response) {
            

              console.log(response)

                
            }).error(function (data) {
                console.log("erro addCheckState");
            });

Open in new window


Reason for sending this way is im using subaction to trigger a case than i plan to also send muitple data with same ajax etc. like data is to call the case, then other wil be to do something within that case. but i get the follow error when i have only passed in one data.

any tips on where i am going wrong?
0
4 Comments
Cloud Class® Course: Microsoft Azure 2017
LVL 12
Cloud Class® Course: Microsoft Azure 2017

Azure has a changed a lot since it was originally introduce by adding new services and features. Do you know everything you need to about Azure? This course will teach you about the Azure App Service, monitoring and application insights, DevOps, and Team Services.

Start This Course
Hello guys good evening... I have dataTable with Drop Down sorting using their unique ID's
 i want to filter dataS to table by Branch... How can I achieved it using server side pdo jquery here is my code

Drop Down
<label>Branch</label>
<select id="branch" class="form-control">
<option value="">Select Branch</option>
<option value="1'">First Branch</option>
<option value="2'">Second Branch</option>
<option value="3'">Third Branch</option>
</select>
<!----Table Item Data------>
<br/>
		<div class="container box" style="width:100%;">
			<div class="table-responsive">		
				<table id="itemdata" class="table table-bordered table-striped" width="100%">
					<thead>
						<tr>
						<th width="10%">Branch</td>
						<th width="10%">Outlet</td>
						<th width="15%">User</td>
						<th width="15%">Item</td>
						<th width="10%">Brand</td>
						<th width="10%">Serial No.</td>
						<th width="10%">Purchase Date</td>
						<th width="20%">Remarks</td>
						</tr>
					</thead>
					<tfoot>
						<tr>
						<th>Branch</td>
						<th>Outlet</td>
						<th>User</td>
						<th>Item</td>
						<th>Brand</td>
						<th>Serial No.</td>
						<th>Purchase Date</td>
						<th>Remarks</td>
						</tr>
					</tfoot>
				</table>
			</div>
		</div>

<script>
$(document).ready(function () {
	var dataTable = $('#itemdata').DataTable({
		"dom": '<"#buttons">lrti<"clear">',
		"bFilter": true,
		"bInfo": false,
		"scrollY":        "50%",
		"footer": true,
		"header": true,

Open in new window

…
0
0 Comments
so im displaying a array result of a drop down.

it returns this data here - this is what it looks like in a alert -

<select style ='width:100%;' class='formInput' name='property'2527'' id='property'2527''><option value=''>- select -</option>,<option value='test1' >test1</option>,<option value='test2' >test2</option>,<option value='test3' >test3</option>,</select>

Open in new window


this is how it looks in the console.log - 

"<select style ='width:100%;' class='formInput' name='property'2527'' id='property'2527''><option value=''>- select -</option>"
1
:
"<option value='test1' >test1</option>"
2
:
"<option value='test2' >test2</option>"
3
:
"<option value='test3' >test3</option>"
4
:
"</select>"

Open in new window


So far so good to me it looks in correct order.

but when i append the coniner i get the following display

<select style="width:100%;" class="formInput" name="property" 2527''="" id="property"><option value="">- select -</option></select>
<option value="test1">test1</option>
<option value="test2">test2</option>
<option value="test3">test3</option>

Open in new window


as you can see this is a different format from the array the options are outside the select.

here is how the array is set-up -

if($cusData['propertyType'] >=4 && $cusData['propertyType'] <=6) {
							$teststring = ["<select style ='width:100%;' class='formInput' name='property'".$cusData['propertyId']."'' id='property'".$cusData['propertyId']."''><option value=''>- select -</option>"];
							$testResult = "property found";

								$stmt = new Database();

								$query = "SELECT *
											FROM custom_property_values
											WHERE property_id = :propertyID
											ORDER BY id ASC";
								$stmt->query( $query );
								$stmt->bind( ':propertyID', $cusData['propertyId'] );
								$stmt->execute();
								$result = $stmt->all();

								foreach($result as $selectData){
									array_push($teststring , "<option value='".$selectData['value']."' ".($subrow['infomation'] == $selectData['value'] ? "selected='selected'" : "").">".$selectData['value']."</option>");

								}//selectData
								
								array_push($teststring, "</select>");

Open in new window


any hints to what i am doing wrong ?
0
3 Comments
I have been converting data to csv files simply by making the href target the controller responsible for it and when the user clicks on the link, the csv file downloads automatically.

However, in this particular case I actually need to send some data along where I didn't for the others. So, when just fetching some data I simply did the below and that points directly to the controller responsible for creating the file.

<a href="<?php echo URLROOT; ?>/Widgets/exportUsers" class="m-widget4__icon" download>
	<i class="la la-download"></i>
</a>

Open in new window



Here is the jQuery and Ajax for the date range picker. I have to split the dates so I have a start date and end date to pass through. 

		$( '.salesclick' ).on('click', function(e) {
			e.preventDefault();
			var wholeDate = $( '#daterange' ).val();
			var index = wholeDate.indexOf(" ");  
			var start_date = wholeDate.substr(0, index); 
			var end_date = wholeDate.substr(index + 2); 
			$.ajax({
				url: url + '/Widgets/exportSales',
				type: 'POST',
				data: {start_date: start_date, end_date: end_date}
			})
			.done(function (data) {
				alert(data);
			})
		});

Open in new window


That goes to my controller:

       
	$start_date = $_POST['start_date'];
		$end_date = $_POST['end_date'];
		
		$results = $this->DashboardModel->listSales($start_date, $end_date);
		$filename = 'Sales_' . date('dmY') . '.csv'; 
			
			header("Content-Description: File Transfer");
			header("Content-Type: application/csv");
			header("Content-Disposition: attachment; filename=$filename");
			header("Cache-Control: must-revalidate, post-check=0, pre-check=0");

			
			$handle = fopen('php://output', 'w');
		
			$header = array("Order Date"); 
			fputcsv($handle, $header);		
				foreach ($results as $result):
					fputcsv($handle, $result);
				endforeach;

			fclose($handle);
	}

Open in new window


And here is the model:

		$this->db->query("SELECT `order_date` FROM `order_summary` WHERE `order_date` BETWEEN :start_date AND :end_date");
		$this->db->bind(":start_date", $start_date);
		$this->db->bind(":end:date", $end_date);
		$results = $this->db->arraySet();
		return $results;

Open in new window


I am getting an error when just trying to see the data:

Uncaught PDOException: SQLSTATE[HY093]: Invalid parameter number: parameter was not defined

Then there is another bit about
Dashboard-&gt;listSales('2018-08-06', '2018-08-06')
0
5 Comments
How can I make the datatable on https://www.gopherstateevents.com/results/fitness_events/results_scrollx.asp?event_id=794 show all rows and not show a search bar?

Thanks!
0
3 Comments
Getting Error 

Uncaught TypeError: Cannot read property 'ownerDocument' of undefined
    at Function.fa.contains (jquery-2.2.4.min.js:2)
    at ca (jquery-2.2.4.min.js:3)
    at ua (jquery-2.2.4.min.js:3)
    at n.fn.init.append (jquery-2.2.4.min.js:3)
    at Object.<anonymous> (contact-profile.js:104)
    at i (jquery-2.2.4.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-2.2.4.min.js:2)
    at z (jquery-2.2.4.min.js:4)
    at XMLHttpRequest.<anonymous> (jquery-2.2.4.min.js:4)

Open in new window


when trying to append a container with data.

socialIcons.push($(['<a href= "' + demo1.infomation.URL[i] + '" target="_blank" title="'+ demo1.infomation.TYPE_NAME +'">','<img  width="30" height="30" src="images/icons/fullcontact/"'+ demo1.infomation.TYPE_ID[i] +'.png" />'
            ,'</a>' ]));
            console.log(socialIcons); // socialicons

$("#social-icons").append(socialIcons);

Open in new window


the following array outputs this to console. 

n.fn.init(3) ["<a href= "http://www.pinterest.com//" tar…itter,LinkedIn,Klout,Facebook,Flickr,Foursquare">", "<img  width="30" height="30" src="images/icons/fullcontact/"pinterest.png" />", "</a>"]
1
:
n.fn.init(3) ["<a href= "http://vimeo.com/user9875399" target="_b…itter,LinkedIn,Klout,Facebook,Flickr,Foursquare">", "<img  width="30" height="30" src="images/icons/fullcontact/"vimeo.png" />", "</a>"]
2
:
n.fn.init(3) ["<a href= "https://gravatar.com/" target="_bl…itter,LinkedIn,Klout,Facebook,Flickr,Foursquare">",

Open in new window

…
0
4 Comments
I have a textbox field. User can type a desire keyword and then click on Search button or Press ENTER key.This will call a JS function which actually runs an AJAX code to perform a search

Also the keywords are appended with browser url like :
http://www.mydomain.com/search?keywords=2018
(I have a short js code for this which append keywords with url)


The Issue:

If user directly open this url
http://www.mydomain.com/search?keywords=2018
Then search function is not called.

Also if user change the search keywords like
http://www.mydomain.com/search?keywords=hello
Then search function must be called with these parameters

I want that user can also enter  search keywords via the URL also

Here is my code

jQuery("#SearchKeyword").keypress(function(e) {
    if(e.which == 13) {
        inputNewsSearch();    
    }
});

Open in new window


And this is the function code

function inputNewsSearch(){

    var SearchKeyword = jQuery("#SearchKeyword").val();	
	
            jQuery.ajax({
        type: "POST",
		url: base_path+'sites/all/themes/nexus/templates/news-search.php?',	
        data: {SearchKeyword:SearchKeyword,path_base:path_base,lang_name:lang_name},
        async: true,

        error: function(jqXHR, textStatus, errorThrown) {
            alert(jqXHR.status);
            alert(textStatus);
            alert(errorThrown);
        },
        success: function(result) {
			
		if (history.pushState)
		{
          var newurl =

Open in new window

…
0
5 Comments
Populated Dropdown data is not inserting into database table 

<div id="div5">
                <input type="text" placeholder="Sub Category Name" required="" id="subcatname" name="subcatname" />
    <script>

        $(document).ready(function(){

        	 $.ajax({
              type: "Post",
              url: "getAttribute.php",
              success: function(data) {
                    var obj = $.parseJSON(data);      
                    var result = "<select id="+ this['catname'] + " ><option>select Parent Category</option>";
                    $.each(obj, function() {
                        result = result + "<option value=" + this['catname'] + ">"+ this['catname'] +"</option>" ;
                    });
                    result = result + "</select>"
                    $("#result1").html(result);
              }
        }); 
            $("#subcat").click(function(e){
                   e.preventDefault();
                //var color=$("#color").val();
                var subcatname=$("#subcatname").val();
                var subcat=$("#subcat").val();
                 var catname=$("#catname").val();
                
                $.ajax({
                    url:'color.php',
                    method:'POST',
                    data:{
                       
                       subcatname:subcatname,
                        subcat:subcat,
                        catname:catname
                    },
                   success:function(data){

Open in new window

…
0
4 Comments
Hi,

I have a form here: headstudios.com.au/hsfast at the bottom - which is an ajax form. It is linked to my Mailchimp and I am trying to make the text field a text area for the 'Message' field (which would involve modifying the theme files to some extent).

My question is - how can I find the jQuery that gets fired when the form is submitted? Preferrably I would like to do this with Firefox - I have been doing some reading about the debugger but what I would ideally like is to click on the Submit button and see what code gets triggered.

Any input would be much appreciated (and if you could just tell me where the code is that would be great too).

Thanks
0
4 Comments
I am developing various .NET web apps and I am having trouble with the treatment of MS SQL Date as opposed to datetime.
Because .NET does not include a Date only datatype each date field is being appended with midnight to make it a datetime.

The records that I am working with have dates that I would call a document date.
For example an invoice from a third party has a date that is the date of record and should not be altered if viewed in another timezone.

I am able to convert the date to a string on the server side but then I cannot use date methods to perform searching/sorting/filtering, and regardless the datepicker on the browser side will always alter the values submitted to "adjust" for difference in the server and client timezones.

Is there a method of having a datetime field but preventing the value being changed when viewing in another timezone?
0
9 Comments
Upgrade your Question Security!
LVL 12
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Go Premium
Hello Experts!

I want to eliminate the hidden input on DataTable. The following code is working well but the hidden input distorts the layout of my table so I want to re-write the code to eliminate the hidden input.

Code:
var myDt = $('#assessmentTable').DataTable({
                "paging": false,
                columns : [
                    { data : 'Roll_No' },
                    { data : 'Student_ID' },
                    { data : 'Student_Name' },
                    {
                        orderable: false,
                        render: function (data, type, row) {
                            return '<input type="text" maxlength="2" size="6" name="cass1[' + row.Enroll_ID + ']" value="' + row.CA1 + '">';
                        }
                    },
                    {
                        orderable: false,
                        render: function (data, type, row) {
                            return '<input type="text" maxlength="2" size="6" name="cass2[' + row.Enroll_ID + ']" value="' + row.CA2 + '">';
                        }
                    },
                    {
                        orderable: false,
                        render: function (data, type, row) {
                            return '<input type="text" maxlength="2" size="6" name="cass3[' + row.Enroll_ID + ']" value="' + row.CA3 + '">';
                        }
                    },
                    {
                        orderable: false,

Open in new window

…
0
3 Comments
Experts!

Is there a way to check type of notify (success or danger) and add a code as in the following code?

I added an automatic button click in the Ajax code so that the DataTable can be refreshed after success. I don't want to perform the button click if there's an error so the DataTable doesn't refresh. Because if it does, the user input will be wiped out.

$('#add_assessment').click(function() {

                $.ajax({
                url     : 'assessment_add_controller.php',
                method  : 'post',
                data    : $('#assessmentForm').serialize(),
                dataType : 'json',
                }).done(function(response) {
                    $('button[name=loadStudents]').click();
                    var type = response.status ? 'success' : 'danger';
                  $.notify({
                    // options
                    message: response.message
                    },{
                    // settings
                      type: type + ' my-notify',
                      placement: {
                        align: 'center' 
                    },
                    animate: {
                        enter: 'animated fadeInDown',
                        exit: 'animated fadeOutUp'
                    }
                                           
                  });

                });

            });

Open in new window


Or can I just perform array_filter() in the Ajax before it gets to Insert/Update in the script?

I'm doing it this way:

Open in new window

…
0
2 Comments
Hello, first off i am a novice here. I am a designer but no coding knowledge. My problem is  i'm trying to get this contact form to send messages but it's only letting the user input text into the fields but when you hit the send button nothing is sent. Any help is much appreciated.

the php action is attached.
the form code:

 	<script type="text/javascript">
			$(function(){
				/* ========================================================================= */
				/*	Contact Form
				/* ========================================================================= */
				
				$('#contact-form').validate({
					rules: {
						name: {
							required: true,
							minlength: 2
						},
						email: {
							required: true,
							email: true
						},
						message: {
							required: true
						}
					},
					messages: {
						name: {
							required: "come on, you have a name don't you?",
							minlength: "your name must consist of at least 2 characters"
						},
						email: {
							required: "no email, no message"
						},
						message: {
							required: "um...yea, you have to write something to send this form.",
							minlength: "thats all? really?"
						}
					},
					submitHandler: function(form) {
						$(form).ajaxSubmit({
							type:"POST",
							data: $(form).serialize(),
							url:"gdform.php",
							success: function() {
								$('#contact-form :input').attr('enabled', 'enabled');
								$('#contact-form').fadeTo( "slow", 0.15, function() {

Open in new window

…
0
9 Comments
Experts!

Please how can I adjust the Bootstrap Notify so the width automatically adjusts to the screen size?

See the screenshots.

My own:
Screenshot_1.png
I want something like this:
like_this.png
Thanks
0
5 Comments
http://www.dropzonejs.com/examples/simple.html


I use above dropzone to upload document. And I am able to add/remove files. My qusestion is when the remove files method is executed, I want to add some codes for some other things like delete a record in the database. And I can use ajax to do that. but I do not know how to put my codes in "Remove" action.
Can you show me how to get there?
0
21 Comments
Hello guys  I have table listing files inside a folder with their names and extension. Now what i want to happen now is to get selected name and insert in into database...The problem is i use form inside table and post data using aJax.instead of inserting the first name 2nd name the last name will be inserted into the database not the selected file name...it only get the last name... here is my code...

<html>
<?php
include ('include/head.php');
?>
<body>
<div class="div1" id="div1" align="center"></div>
<button type="button" name="backup" id="backup" class="btn btn-primary backup";
<b><i class="fa fa-print" aria-hidden="true"></i> Backup Database</b></button></br></br>
<!---Table--->
<div class="container">
  <h2>This is just a test..heheheh</h2>        
  <table class="table table-bordered">
    <thead>
      <tr>
        <th>Database Name</th>
        <th>Action</th>
      </tr>
	</thead>
	<tbody>
      
<?php
$files = scandir('include/backup');
sort($files); // this does the sorting
foreach($files as $file){
	if($file != '.' && $file != '..' && !is_dir($file)){
echo '<tr>	<td>
			<form name="form1" id="form1" method="post">
			<input type="hidden" name="dbname" id="dbname" class="dbname"  value="'.$file.'"/>
			'.$file.'
		</td>
		<td>
			<input type="hidden" name="id" id="id" class="id"  value="1"/>
			<input type="submit" value="Restore Backup" />
			</form>
		</td>
	</tr>
';
	}
}
?>


				
			
		</tbody>
	</table>
</div>
</body>
</html>
<script>

Open in new window

…
0
2 Comments

AJAX

12K

Solutions

13

Content

i
The collection of articles, videos, and posts on this topic.

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.

Advertise Here
Advertise Here