[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x

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

Hello Experts!

I normally populate DataTable with the following combination. When a button is clicked, the table is populated through AJAX call as long as there's at least 1 row of data. But if there're no data in the table from MySQL, nothing happens. So, I want a message to return when there's no data coming from database.

Please help me manipulate this:

<?php 

require_once '../.../db_connection.php';

$stmt = $conn->prepare( "SELECT ... FROM ... WHERE ..." );
$stmt->bind_param( "ssssi", $_POST['session'], $_POST['term'], $_POST['class'], $_POST['subject'], $_POST['limit'] );
$stmt->execute();

$assessment = $stmt->get_result()->fetch_all(MYSQLI_ASSOC);
die( json_encode($assessment) );
?>

Open in new window



Here is my AJAX:
$('#loadStudents').click(function() {
   $.ajax({
   method : 'post',
   url : '../data/ass1_Data',
   data : { session : $('#session').val(), term : $('#term').val(), class : $('#c_taught').val(), subject : $('#s_taught').val(), limit : $('#process_limit').val(), },
   dataType : 'json',
   }).done(function(data) {
      myDt.clear().draw();
      myDt.rows.add(data).draw();
   });
});

Open in new window


Thank you in advance.
0
Amazon Web Services
LVL 12
Amazon Web Services

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.

Hello Experts!

I normally populate DataTable with the following combination. When a button is clicked, the table is populated through AJAX call as long as there's at least 1 row of data. But if there're no data in the table from MySQL, nothing happens. So, I want a message to return when there's no data coming from database.

Please help me manipulate this:

<?php 

require_once '../.../db_connection.php';

$stmt = $conn->prepare( "SELECT ... FROM ... WHERE ..." );
$stmt->bind_param( "ssssi", $_POST['session'], $_POST['term'], $_POST['class'], $_POST['subject'], $_POST['limit'] );
$stmt->execute();

$assessment = $stmt->get_result()->fetch_all(MYSQLI_ASSOC);
die( json_encode($assessment) );
?>

Open in new window



Here is my AJAX:
$('#loadStudents').click(function() {
   $.ajax({
   method : 'post',
   url : '../data/ass1_Data',
   data : { session : $('#session').val(), term : $('#term').val(), class : $('#c_taught').val(), subject : $('#s_taught').val(), limit : $('#process_limit').val(), },
   dataType : 'json',
   }).done(function(data) {
      myDt.clear().draw();
      myDt.rows.add(data).draw();
   });
});

Open in new window


Thank you in advance.
0
Hello Experts!

Please why am I getting
Notice: Undefined index: subject in C:\...\createTable.php on line 6
?
NOTE: I can populate the table using DataTable but I don't want to us DataTable for this. If you know how I can do populate HTML Table using AJAX, please help.
HTML Form:
<form method="post" id="enrollmentForm" action="">
   <div class=" form-group center">
      <input type="hidden" name="session" id="session" value="<?= $default_session ?>">
      <input type="hidden" name="term" id="term" value="<?= $default_term ?>">
         <select name="c_taught" id="c_taught">
	   <option value="">Select Class...</option>
	   <?php echo fill_class_box($conn); ?>
	</select>

       <select name="s_taught" id="s_taught">
	<option value="">Select Subject...</option>
	<?php echo fill_subject_box($conn); ?>
       </select>
   </div>
   <div class="form-group center">
      <button type="button" name="loadStudents" id="loadStudents" class="btn btn-sm btn-primary btn-white btn-round">
         <i class="ace-icon fa fa-refresh bigger-150 middle orange2"></i>
         <span class="bigger-110"> Load Students</span>
      </button>
   </div>
</form>

Open in new window


My Ajax:
$(document).ready(function(){
  $("#loadStudents").click(function(){
    //disable the submit button
    $(this).attr('disabled','true');$(this).css('cursor','not-allowed');$(this).html('Processing');
    $.ajax({
      method : 'post',
      url : 'createTable',
      data : { class : $('#c_taught').val(), subject : $('#s_taught').val() },
      data : 'json',
      success: function(data)
      {
      	$('#enrollTable').html(data);
        //enable the submit button
        $('#loadStudents').css('cursor','pointer');$('#loadStudents').html('Submit');$('#loadStudents').removeAttr('disabled');
      },
      
    }); 
  });
});

Open in new window

Then, createTable.php
<?php
session_start();

include('../../db_connection.php');

$s_taught = $_POST['subject'];

$stmt = $conn->prepare( "SELECT ... WHERE Class_Name = ? AND ".$s_taught." = 0 AND Total_Subjects < 12 AND Status = 1 ORDER BY Roll_No" );
$stmt->bind_param( "s", $_POST['class'] );
$stmt->execute();
$students = $stmt->get_result();

$data = array();

while ( $student = $students->fetch_object() ):

    $data[] = array(
        "roll_no" => $student->Roll_No,
        "student_id" => $student->Student_ID,
        "student_name" => $student->Student_Name,
    );

endwhile;

$response = array(
    "data" => $data,
);

echo json_encode($response);
    
?>

Open in new window


Thank you  for your help.
0
We were talking about replacing out Grid.MVC with jQuery DataTables.

Suppose we have 10 pages. Each page has a grid but goes to a different datasource to get the data. Different columns, etc.

The developer on our team mentioned something about having a generic jQuery/AJAX code .... only ONE ... for all the pages. How would that work? is he correct that we can only have one jQuery file?

Ex: User is on page1 and want to get data from table1.  If it's true that we can only have one jQuery code to make an AJAX call...how can we tell it to this is page1 and go to table1. Then, how can we tell it this is page2 and go to table2 to get data?
1
Hello Experts!

I need help on how to effectively upload image to the folder and insert the directory in MySQL Database.

I've tried in many ways. I was able to upload and insert but I don't like the way my code is handling it. I couldn't validate the image properly. I don't know how.

I tried the following but no response:

my html form (modal):
<div class="modal fade" id="modal-media">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Profile Picture</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    <span class="sr-only">Close</span>
                </button>
            </div>
            <form id="profilePic" action="user_img_controller.php" method="post" enctype="multipart/form-data">
                <div class="modal-body">
                    <div class="col-md-12 text-center">
                        <img class="img-circle hs-img-disp profile-image" src="../assets/img/no-photo-3.png" alt="Profile Picture">
                        <div id="updateError"></div>
                        <input type="file" name="fileToUpload" id="fileToUpload" class="profile_img" multiple accept="image/*" style="display:none" onchange="handleFiles(this.files)">
                        <button id="fileSelect" class="btn btn-primary">Select 

Open in new window

1
Is there any working solution to block AJAX popup divs in Chrome and Firefox?
0
Is it possible to destory a bind on the DOM and recreate it ? let say i add data to a table from a Ajax request i would need to rebind that to the dom for the new inserted data ?
1
Hi Guys,
I am using asp.net mvc.
I built a method in  the backend that let me stream file and download to my dom:
Here is my backend method.

Public Function DownloadFiles(attachmentsSelected As String, zipFileName As String) As FilePathResult
        Dim obj As FileDownloads = New FileDownloads()
        ''get file list user choose to download
        Dim filesCol = obj.GetFile(attachmentsSelected).ToList()

        Dim fileSavePath As String = IO.Path.Combine(System.Web.Hosting.HostingEnvironment.MapPath("~/DownLoadAttachments"), zipFileName)
        Using stream = New FileStream(fileSavePath, FileMode.Create)
            Using ziparchive = New ZipArchive(stream, ZipArchiveMode.Create, True)

                For i As Integer = 0 To filesCol.Count - 1
                    'ziparchive.CreateEntryFromFile(filesCol(i).FilePath + "\" + filesCol(i).FileName, filesCol(i).FileName, CompressionLevel.Optimal)
                    ziparchive.CreateEntryFromFile(filesCol(i).FilePath, filesCol(i).FileName, CompressionLevel.Optimal)
                Next
            End Using
        End Using

        Return File(fileSavePath, "application/zip", "Attachments.zip")
    End Function

Open in new window


Now from the front end I do something like that.

 window.location = "/DocumentViewer/DownloadFiles?attachmentsSelected=" + func.downloadFilesList + "&zipFileName=" + uuid;

Open in new window


The issue I have with this approach is - I want to delete the file from my server after the client download it so I need another call to the server ..let's say with ajax and delete, but the problem is I can't predict the time when this URL finish the process of downloading in the backend

Does anyone have an idea how to do it? I was trying Promise but it doesn't really work in this scenario.

Thank you.,
0
Modal is not working after 1st page when click on "Change" button  in datatable bootstrap:



View Info Modal :
<div id="dataModal" class="modal fade">  
      <div class="modal-dialog">  
           <div class="modal-content">  
                <div class="modal-header">  
                     <button type="button" class="close" data-dismiss="modal">&times;</button>  
                     <h4 class="modal-title">Customer Details</h4>  
                </div>  
                <div class="modal-body" id="customer_detail">  
                </div>  
                <div class="modal-footer">  
                     <button type="button" class="btn btn-gradient-light btn-fw" data-dismiss="modal">Close</button>  
                </div>  
           </div>  
      </div>  
 </div>

Open in new window


Change Info Modal:
 <div id="changeModal" class="modal fade">  
      <div class="modal-dialog">  
           <div class="modal-content">  
                <div class="modal-header">  
                     <button type="button" class="close" data-dismiss="modal">&times;</button>  
                     <h4 class="modal-title">Change Status</h4>  
                </div>  
                <div class="modal-body" id="change_detail">  
                </div>  
                <div class="modal-footer">  
                     <button type="button" class="btn btn-gradient-light btn-fw" data-dismiss="modal">Close</button>  
                </div>  
           </div>  
      </div>  
 </div> 

Open in new window


JQuery :
 $(document).ready(function(){  
      $('.view_data').click(function(){  
           var book_id = $(this).attr("id");  
           /*alert(employee_id);*/
           $.ajax({  
                url:"ajax/viewCustomer.php",  
                method:"post",  
                data:{book_id:book_id},  
                success:function(data){ 
                     $('#customer_detail').html(data);  
                     $('#dataModal').modal("show");  
                }  
           });  
      });  
 });
  $(document).ready(function(){  
      $('.change_data').click(function(){  
           var book_id = $(this).attr("id");
           $.ajax({  
                url:"ajax/updateServiceStatus.php",  
                method:"post",  
                data:{book_id:book_id},  
                success:function(data){ 
                     $('#change_detail').html(data);  
                     $('#changeModal').modal("show");  
                }  
           });  
      });  
 });

Open in new window

1
When I click on "Make Payment" button then only ajax run but paypal sandbox not works.
There should be 1st paypal will open and then email send after registration.

Paypal_url = https://www.sandbox.paypal.com/cgi-bin/webscr.
ajax id = registerform.

HTML Code:
.
.
.
<form method="POST" class="dzForm paypal form-inline" action="https://www.sandbox.paypal.com/cgi-bin/webscr" name="registerform" id="registerform">
.
.
.
<input class="btn btn-medium btn-transparent-orange" type="submit" name="insert" value="Make Payment">

Open in new window

.
.
.
AJAX Code:
$("#registerform").submit(function(e) {
			e.preventDefault();
			$("#msg").html("");
			var name = $("#name").val();
			$("#submitbtn").prop('disabled', true);
			$.ajax({
				type: "POST",
				data: $("#registerform").serialize(),
				url: "php/register.php",
				cache: false,
				beforeSend: function (){
						$("#submitbtn").val('Sending..Please wait');
				},
				success: function (response) {
						if(response==1){
							$("#msg").html("Thank you "+name+" ! You have been registered successfully.");
							$("#submitbtn").prop('disabled', false);
							$("#submitbtn").val('Register Now');
							$("#registerform").trigger('reset')
						} else{
							$("#msg").html("<span style='color:red'>"+response+"</span>");
							$("#submitbtn").prop('disabled', false);
							$("#submitbtn").val('Register Now');
							$("#registerform").trigger('reset')
						}
				}
			});
			return false;
		});

Open in new window

0
OWASP Proactive Controls
LVL 12
OWASP Proactive Controls

Learn the most important control and control categories that every architect and developer should include in their projects.

I have jQuery/Javascript on my page at:
http://www.domain-a.com/page.html

...and I am trying to do a jQuery $.post to:
https://www.domain-b.com/script.asp

But I get this error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at...

On www.domain-b.com I have the following in web.config (this is an IIS server):

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="*" />
            </customHeaders>
        </httpProtocol>
    </system.webServer>
</configuration>

Open in new window


...however, I still get the error. I don't have access to .htaccess or anything else on www.domain-a.com. Is it possible for me to resolve this issue, or is it not possible because I don't have access to the www.domain-a.com server? It isn't clear to me if I need to add Access Control to the server where the web page resides, or the server where the target script resides.

Thank you.
0
Here is a simple CSRF class I am using:

<?php
 
namespace Core;
 

/**
 * CSRF protection
 */
class CSRF
{
    /** 
     * Get and store a new CSRF token
     *
     * @return string  A 32-character token
     */
    public static function getToken()
    {   
        $token = new \App\Token();
        $value = $token->getValue();
        $_SESSION["csrf_token"] = $value;
 
        return $value;
    }
 
    /** 
     * Check the token value
     */
    public static function checkToken()
    {   
        if ($_SERVER['REQUEST_METHOD'] == 'POST') {
            if ( ! isset($_POST['csrf_token'])) {
               header('HTTP/1.0 403 Forbidden');
               exit('Missing CSRF token');

            }
 
            // Get the token from the session and remove it
            $token = $_SESSION['csrf_token'] ?? '';
            unset($_SESSION['csrf_token']);
 
            if ($_POST['csrf_token'] != $token) {
                header('HTTP/1.0 403 Forbidden');
                exit('Invalid CSRF token');

            }   
        }   
    }   
}

Open in new window


Then I have the token in a hidden form field:

<input type="hidden" name="csrf_token" value="<?php echo $csrf_token; ?>">

Open in new window


This is my controller:

 
   public function createAction()
    {
        if($_SERVER['REQUEST_METHOD'] === 'POST') {
            
            $response = [];
            
            $customer = new Customer();
            if($customer->save($_POST)) {
                
                $response['success'] = true;
                $response['message'] = 'Customer successfully added';
                
             } else {
                
                $response['success'] = false;
                $response['message'] = $customer->errors;
            }
            
            echo json_encode($response);
        }
    }

Open in new window


If I wasn't using Ajax and I just called that method in the controller like:

CSRF::checkToken();

Open in new window


then it works fine and the 403 occurs. But since I am using Ajax, the page just hangs and the error shows up in console. So, I click submit and the form validation takes place. If there are errors then I use jQuery /json to show the errors:

        .done(function (data) {
            if (!data.success) {

                unblockUI();
                $.each(data.message, function(index, item) {
                    $( '.alert-danger' ).append(item + "<br>").fadeIn();
                });

Open in new window


Is it possible to make the 403 happen or would I need to do something else? It is no good as is that the page just freezes up and the 403 error is shown in console. In theory, genuine users should never have this happen, but I still want to handle it more elegantly anyway.
0
I would like to create a button on a php page that would table the records from the file on the server and load it into a mysql table.

This is a php page. It has records in the form of a table on the page. I will have the button id, the same as the file I would like to load into the mysql table. The files already reside on the server in a folder called uploaded.

Here is what I can do so far.

1. Capture the name of the file on the table with the id using jquery and ajax to push the file name to a php file that is to write the rows in the the csv file to the table.

A simple example with a field or two would be very helpful. All my fields are text as there is some characters that make the input from the csv file a little unpredictable.  

Please note the first row will have the field headings in the csv, so would need to start at row 2 and loop through the rest of the rows.
0
Hi Guys,
I have implemented progress bar with js and html progress tag.

Here is my sample implementation

<progress id="progressBar" value="0" max="100" style="width:300px; height: 40px;"></progress>
    <span id='status'></span>

  function Progressbarsx(perc) {
      var bar = document.getElementById('progressBar');
      var status = document.getElementById('status');
      status.innerHTML = perc + "%";
      bar.value = perc;
      perc++;
      var sim = setTimeout("Progressbarsx("+ perc +")", 100);
      if(perc == 100){
          status.innerHTML = 100;
          clearTimeout(sim);
      }
    }
    var amountrun = 0
    Progressbarsx(amountrun)

Open in new window

:

That is working fine.
Now I have a scenario in my production environment when I run a lot of ajax call for returning data from server.

I used to using spinning bar that spin until ajax function finish, but now I want to show progress bar and calculate the time until the return come back. exactly like I show in my example.
Now I want to do something like that:

 $(document).ajaxStart(function (val) {
        //call to my progress bar in a real time 
    }).ajaxStop(function (val) {
        //end the call after ajax stop.
    });

Open in new window


Please, let me know what is the idea of doing something like that.

Thank you.
0
Hello Experts!

Please, help. I don't know why this code is not opening modal to a specific record. It only opens the first record on the list. The second link shows the first record when clicked. If I refresh the page and click on the second link first, it shows nothing.

I already tested the id for each list, that is fine.

the message.php
<?php while ($message = $result->fetch_object()): 
  $timestamp = $message->msg_date;
  $date = new DateTime($timestamp);
  $date_posted = $date->format('d M Y h:i A');
?>
                                
<div class="content" id="noticeMessage">
  <a class="content-title" href="#"><?= $message->title; ?></a>
  <p class="content-date"><?= $message->category; ?> | <?= $date_posted; ?></p>
  <p class="content-body"><?= $message->description; ?></p>
  <a class="light-green feed-link learnMore" href="#" data-toggle="modal" data-target="#noticeModal" data-id='<?= $message->msg_id; ?>'>Learn more</a>
</div>
<?php endwhile; ?>

Open in new window

modal dialog:
<div class="modal fade" id="noticeModal" tabindex="-1" role="dialog" aria-labelledby="noticeModalTitle" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h3 class="modal-title" id="noticeModalTitle">Message Content</h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div id="getNoticeContentDiv"></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

Open in new window

the modal gets data from: notice_modalForm.php:
<?php
require_once '../.../connect.php';

$query = $conn->prepare("SELECT * FROM tbl_message WHERE msg_id = ?");
$query->bind_param("i", $_POST['id']);
$query->execute();
$result = $query->get_result();
$message = $result->fetch_object();

?>

<div class="content">
	<a class="content-title"><?= $message->title; ?></a>
	<p class="content-date"><?= $message->category; ?> | <?= $message->msg_date; ?></p>
	<p class="content-body"><?= $message->description; ?></p>
	<p class="content-body"><?= $message->details; ?></p>
</div>

Open in new window

using this code:
$('#noticeMessage').on('click', '.learnMore', function(e) {
            e.preventDefault();
            $.ajax({
                url     : 'views/notice_modalForm',
                method  : 'post',
                data    : { id : $(this).data('id') }
                })
                .done(function(data) {
                    $('#getNoticeContentDiv').html(data);
                    $('#noticeModal').modal('show');
                });
            });   
            
        });

Open in new window

Thank you for your help
0
Screen-Shot-2018-10-29-at-11.10.05.png

              $(document).on('click', '#action-unSub', function(){
        $.ajax({
            url: "unsubscribe-manual.php",
            type: "POST",
            data: { email:<?=$v_item['CONTACT_EMAIL'];?> },
            success: function(html){
            
             
            },
            error: function(html){
               
            }
        });
    });

Open in new window


what is the issue ?
0
The following code in javascript is working fine. I use window.location.href = "/Home/MotorhomeEditMedia/" + result; to reload the webpage to make the webpage show the latest
records from our database.

My question: How to add some sort of ajax to make it e.g. loading icon and gray out?  Now it is refreshing the page, but I want to be seamless ajax load so the user does not feel that the webpage is refreshing.



<script>
                                                                    function SubmitNewEmbeddedLink()
                                                                            {
                                                                               // alert(document.getElementById("url").value);                                                                       
                                                                               $.ajax({
                                                                            url: "/Home/EditMotorhomePhotoandmedia",
                                                                            datatype: "json",
                                                                            data:
                                                                            {
                                                                                'fleetid': @id,
                                                                                'filename': document.getElementById("url").value,

Open in new window

0
I am using Ajax to request the data. I am making an array and send it with json_encode so that I will receive the data in my Ajax Success function.
Now, here is my code:

$sql = "SELECT * FROM  mydata where id=15";		
			$rst = mysqli_query($conn,$sql) or die(mysqli_error($conn));					
			if (mysqli_num_rows($rst) > 0)
			{				
				while( $proj_gall_img = mysqli_fetch_array($rst) )
				{							
					$project_gallery_images[] = $proj_gall_img['img_name'];
					//$project_gallery_images.= $proj_gall_img['img_name']."|";
				}
				
			}
			
$projects_name[] = '<span data-id="' . $projects_row['id'].'" data-title="' . $projects_row['project_title'].'" data-detail="' . $projects_row['project_detail'].'" data-mimage="' . $projects_row['project_image'].'" data-mgallery="' . @$project_gallery_images.'"  class="li-txt" style="color:#ff0000;"><a id="myAnc" href="#">'.$projects_row['project_title'].'</a></span>';

Open in new window


The Problem:
I am easily fetched the value of following data attributes, data-id, data-title, data-detail, data-mimage but I am unable to get the value of data-mgallery in my ajax success function because this is an array.

In my this function I need to fetch this data:
jQuery('body').on('click', 'span.li-txt, span.li-txt2', function() {

var pid = jQuery(this).data('id');
var title = jQuery(this).data('title');
var detail = jQuery(this).data('detail');
var mimage = jQuery(this).data('mimage');	

var gallery = jQuery(this).data('mgallery');	
alert('length='+gallery.length);

Open in new window

The value of pid, title, detail and mimage retrieve successfully, but the value of gallery is Array. How to retrieve it?

Alternatively, how can I fetch the data in Ajax Success method?

Need help in this regard.

Thanks
0
I am calling a WEB API method with parameters from Jquery.
When i run in debug mode on the WEB API side, the parameter always appears null.

On the client side, when the value in the dropdown changes, i call the WEB API method. I have an alert there and i can see the proper value.

Why is the parameter showing up as null on the WEB API side?

My Web API code:
  [EnableCors(origins: "*", headers: "*", methods: "*", SupportsCredentials = true)]
        [Route("api/Services/GetAllServiceItemsForSelectedProgram")]
        [HttpPost]
        public IEnumerable<ServiceItems> GetAllServiceItemsForSelectedProgram(List<LoginParameters> loginParam)
        {
            
            List<ServiceItems> retSvcItem = new List<ServiceItems>();
            object cidString = null;
            //
         }

Open in new window


Jquery Ajax call:
function GetSvcItemsForSelectedProgram(selectProgID) {
            
            alert(selectProgID.value); // value coming good here
            $.ajax({
                type: 'POST',
                url: '/api/Services/GetAllServiceItemsForSelectedProgram',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({ UserName: 'jeri', CompanyID: 'Shah' , ServiceProgramID : selectProgID.value }),
                success: function (data) {
                    $.each(data, function (i, item) {
                        $('#ddSvcProg').append('<option value="' + item.ServiceProgramID + '">' + item.ServiceProgram + '</option>');
                    });
                },
                failure: function (data) {
                },
                error: function (data) {
                }
            });
        }

Open in new window


Internet explorer - developer tools:
I can see the parameters that i sent and the response is 200.

Thanks in Advance
0
C++ 11 Fundamentals
LVL 12
C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

I'm trying call this following function in this ajax call,  var myReturn = processLinkedDocuments(reportId, localInvoiceFormatType); but is skipping it at every single time. Not sure if it's because I have it between some if/Statement but no luck... It never call the processLinkedDocuments function

 $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: '@Url.Action("PrintInvoiceStoreData", "InvoicePrinting")',
                    data: data,
                    success: function (response) {
                        if (response.Success) {
                            reportId = response.Message;

                            var reportCount = 0;
                            if ($('#s3foCallAheadList').prop('checked')) {
                                reportCount++;
                                var url = '@printInvoicesCallAheadReportUrl'.replace("CBNR", reportId);
                                console.log("test1");
                                window.open(url);
                            }

                            if ($('#s3foSchedule').prop('checked')) {
                                reportCount++;
                                var url = '@printInvoicesScheduleUrl'.replace("CBNR", reportId);
                                console.log("test2");
                                window.open(url);
                            }

                            if ($('#s3foWorksheet').prop('checked')) {

Open in new window

0
I need to get information from a XML file where this file is auto upload every 30 seconds.
I want to show this information in a website.

Just to show an example, my website is a radio, and I want to show to users what music he listen.
0
I have the code below. I am trying to update the table when an attachment is being add and/or deleted.  The table is in a partial view.  The issue is that my model.Attachments is not being updated when I go to submit the entire request.  The table displays the row but the model isn't being updated with the new data.  What am I doing wrong?

<div class="form-group row">
                <div class="col-sm-6">
                    @Html.EditorFor(model => model.AttachmentsJSON, new { htmlAttributes = new { @class = "form-control" } })
                    <table class="table" id="ListofFiles">
                        <thead>
                            <tr>
                                <th>Filename</th>
                                <th>Attachment Type</th>
                                <th>Description</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if (Model.Attachments.Count() != 0)
                            {
                                var idCount = 0;

                                foreach (var item in Model.Attachments)
                                {
                                    idCount = idCount + 1;
                                    <tr id="@idCount">
                                        <td>@item.Filename</td>
                                        <td>@item.AttachmentType.Type</td>
                                        <td>@item.Description</td>

Open in new window

0
Hello Experts!

I want to make certain inputs read-only when NOW() is greater than $LimitDate.

I use the following to populate the DataTable:

{
    orderable: false,
    render: function (data, type, row) {
    return '<input class="form-control form-control-sm" type="text" maxlength="2" size="6" name="cass1[' + row.Enroll_ID + ']" value="' + row.CA1 + '">';
    }
},
{
    orderable: false,
    render: function (data, type, row) {
    return '<input class="form-control form-control-sm" type="text" maxlength="2" size="6" name="cass2[' + row.Enroll_ID + ']" value="' + row.CA2 + '">';
    }
}

Open in new window

The $LimitDate holds the date when the input periods expire.

How can I manipulate the two inputs above so the change to READ-ONLY when NOW() is greater than $LimitDate?

Thank you.
0
Hi,

I've a form to send a ajax request which return a json object from a cURL request. I use the form to query the API using the start and and the end date. I've managed to show the datas returned into a table as suggested in this post https://www.experts-exchange.com/questions/29120674/Convert-json-to-html-table.html
Now my problem is every time a make a new request from my form a new table is shown to the form page just after the table I've obtained with the previous request, is there any way to show only one table, so at every form request the previus data is replaced with the new data?

This is my javascript code:
    $(document).ready(function() {

      // Function to create table layout
      function createTable(data) {
        var table = document.createElement('table');
        var header = table.insertRow();

        for(var h in data[0]) {
          var th = document.createElement('th');
          th.innerHTML = h;
          header.appendChild(th);
        }

        table.classList.add('table','table-bordered');
        data.forEach(function(item) {
          var row = table.insertRow();
          for(var v in item) {
            var cell = row.insertCell();
            if (Array.isArray(item[v])) {
              var subtable = createTable(item[v]);
              cell.appendChild(subtable);
            }
            else {
              cell.innerHTML = item[v];
            }
          }
        })

        return table;
      }

      // 

Open in new window

0
Hi- I am reworking an email form that was using server side script to client side. The issue, is that the Javascript navigation does not working correctly with the new Ajax scripts added to page, but if you hit refresh in browser, then the navigation seems to work ok. I am thinking perhaps there is a need to force reload the javascript after the new ajax based scripts load.

The page is here: http://dev.alphagraphicsseattle.com/contact.aspx

The new Ajax code added to the page is here (and we should not alter this vendor supplied code:

<!-- XMPL library -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link type="text/css" href="https://ajax.xmcircle.com/ajax/libs/xmpl/1.9.1/xmp/css/xmp.css" rel="stylesheet" media="screen" />
<script type="text/javascript" src="https://ajax.xmcircle.com/ajax/libs/xmpl/1.9.1/xmp/js/xmp.min.js"></script>
<script type="text/javascript" src="https://cdn.121.ag/sem/ag/skin2/xmpcfg/2gagsemhttps/xmpcfg.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.121.ag/sem/ag/skin2/css/xmpl.css" />
<!-- XMPL library -->

Open in new window


The javascript that manages the navigation style is here:

http://dev.alphagraphicsseattle.com/js/main092718.js

Attached are two screens. One shows how the navigation is not wide enough on page load / before refresh. The other screen shows how the navigation should look / after refresh.

I've tried moving the scripts around in the header, putting them after the body, added defer or async to the javascript lines. If there is a change to main092718.js, that is possible for us to add, but the other ajax scripts, we cannot change.

Is there some way to force the main092718.js to re initialize after ajax scripts or is there something to change in main092718.js? main092718.js has been working forever ok, but the addition of the new scripts has caused issues. Thank you for any direction.  Mark
before-refresh-notworking.png
after-refresh-working.png
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.

Top Experts In
AJAX
<
Monthly
>