javascript — загрузка целевого файла ajax php при начальной загрузке страницы

У меня есть настройка AJAX в php для возврата и отображения некоторых данных из БД:

$("#sub_shops").click(function(){
var range_start = $("#start_shops").val();
var range_end = $("#end_shops").val();
$.ajax({
url:'process_shops.php',
data:{start:range_start,end:range_end},
type:'POST',
success:function(data){
$("#result_shops").html(data);
}
});
});

На странице есть два входа #start_shops а также #end_shopsпосле заполнения данных и нажатия #sub_shops страница отправляет значения из входов в process_shops.php, После обработки он отображает результаты в #result_shops:

<div id="result_shops"></div>

Вопрос:

Если есть значения по умолчанию, установленные для #start_shops а также #end_shops входы, как я могу отправить его значения process_shops.php и отображать обработанные результаты в #result_shops на начальная загрузка страницы?

Заранее спасибо!

2

Решение

Сначала разбейте ваш код на функцию:

function updateResultShops()
{
var range_start = $("#start_shops").val();
var range_end = $("#end_shops").val();
$.ajax({
...
}

Затем вызовите его из обработчика кликов:

$("#sub_shops").click(updateResultShops);

И при загрузке документа!

$(document).ready(updateResultShops);

Теперь любые начальные значения будут отправлены сразу после загрузки страницы и при каждом нажатии. Легко!

3

Другие решения

Если значения предварительно загружены во входные данные, я думаю, что самый простой способ

$("#sub_shops").click(function(){
// your code...
}).trigger('click');
2

Вы можете превратить анонимную функцию в функцию.

function loadAjax()
{
/* Commented this part since it wont run on the snippet.

var range_start = $("#start_shops").val();
var range_end = $("#end_shops").val();
$.ajax({
url:'process_shops.php',
data:{start:range_start,end:range_end},
type:'POST',
success:function(data){
$("#result_shops").html(data);
}
});

*/

alert("blablabla");
}

$("#sub_shops").click(loadAjax); //Add event to click
$(document).ready(loadAjax); //Add event to run when page loads.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="background-color: black; height: 50px; width: 50px;" id="sub_shops"></div>
1
По вопросам рекламы [email protected]