JQuery .load, похоже, запущен в неожиданный момент
Итак, я пытаюсь загрузить некоторый возвращенный html со страницы .aspx, но событие щелчка должно сработать, прежде чем он выполнит некоторые вещи, от которых зависит запрос AJAX. Точнее, я делаю это. Когда пользователь вводит текст в текстовое поле, эта функция запускается ...
function KeyPress() {
$("#" + HiddenButtonId).click();
$("#test").load("TempJumpToAJAX.aspx");
}
затем $ ("#" + HiddenButtonId) .click (); устанавливает некоторые данные сеанса в коде за файлом. Конкретно...
Session["SearchText"] = Search.Text;
затем $ ("# test"). load ("TempJumpToAJAX.aspx"); вызывает эту страницу .aspx, которая возвращает недавно созданное поле выбора ...
Response.Expires = -1;
StringBuilder builder = new StringBuilder();
builder.Append("<select id=\"testListId\" name=\"testList\" size=\"4\" style=\"width:200px;\">");
builder.Append("<option>");
builder.Append(Session["SearchText"]);
builder.Append("</option>");
builder.Append("</select>");
Response.ContentType = "text/HTML";
Response.Write(builder.ToString());
Response.End();
Проблема в том, что порядок, кажется, испорчен, он сначала пытается добавить сеанс ["SearchText"], а затем запускает код, запускаемый событием щелчка. Так что он работает примерно так ...
function KeyPress() {
$("#test").load("TempJumpToAJAX.aspx");
$("#" + HiddenButtonId).click();
}
Где команды меняются местами. Фактически происходит то, что переменная сеанса имеет пустую строку, а не то, что пользователь ввел в текстовое поле. Что для меня странно, так это то, что не похоже, что у нее должна быть пустая строка, похоже, что в ней ничего не должно быть, поскольку переменная сеанса на данный момент не была инициализирована ничем. Я действительно понятия не имею, что происходит. Думаю, это связано с неопытностью. Любые идеи?
Ответы 4
Вы здесь смешиваете технологии. Событие click hiddenButtonID пытается выполнить полную обратную передачу для страницы, тогда как вызов AJAX не выполняет обратную передачу. Нет причин делать ответную публикацию, а затем сопровождать ее вызовом AJAX. Смысл AJAX состоит в том, чтобы исключить необходимость обратной передачи страницы и вместо этого просто перезагрузить небольшой объем HTML на странице, используя небольшой обратный вызов на сервер. Вместо доступа к тексту текстового поля поиска в обработчике события щелчка HiddenButtonID вы должны передавать эти данные на сервер в параметрах вызова AJAX.
Это должен сделать следующий сценарий на стороне клиента.
function KeyPress() {
$("#test").load("TempJumpToAJAX.aspx", {searchText: $("#").val()});
}
В этом коде вы получаете идентификатор текстового поля поиска, а затем используете jQuery для получения значения этого текстового поля. Он будет передан на страницу TempJumpToAJAX.aspx как переменная POST с именем searchText. Вы должны иметь доступ к этим данным, обратившись к переменной Request ['searchText'] на странице 'TempJumpToAJAX.aspx'.
Еще одно умное расширение того, что вы делаете, - не выполнять вызов ajax сразу после нажатия клавиши. Если пользователь быстро наберет длинное слово, вы получите несколько HTTP-запросов ajax, запущенных быстрее, чем они смогут вернуть и обновить ваш пользовательский интерфейс.
Это увеличивает нагрузку на ваш сервер и может замедлить работу пользовательского интерфейса клиента.
Вместо этого, onkeypress, сохраните все необходимые данные, а затем позвоните
var timeout = setTimeout ('some_method ()', 100);
В нем говорится, что вызовите some_method () через 100 миллисекунд. Первое, что вы должны сделать в своем методе нажатия клавиш, - это отменить / очистить вызов тайм-аута с помощью clearTimeout.
http://www.w3schools.com/js/js_timing.asp
Some_method () также должен очистить любой тайм-аут, а затем выполнить HTTP-запрос ajax.
Чистый эффект здесь заключается в том, что ваш запрос ajax немного задерживается, но никогда не происходит, если пользователь нажимает другую клавишу. Или, другими словами, не пытайтесь запускать запрос ajx, пока пользователь не остановит / не приостановит ввод. 100 миллисекунд могут быть слишком высокими или слишком низкими, но, надеюсь, вы поняли идею!
Вы также должны позаботиться о том, чтобы иметь дело с "медленным сервером". Учти это:
- Пользователь вводит "привет", делает паузу на 1 секунду, вы запускаете запрос ajax с параметром "привет".
- Пользователь продолжает вводить «мир», поэтому текстовое поле теперь содержит «привет, мир» и перестает печатать.
- Вы запускаете второй запрос ajax с параметром «hello world».
- Второй запрос («привет, мир») возвращается первым, вы обновляете свой пользовательский интерфейс.
- Первый запрос (на «привет») возвращается, вы снова обновляете свой пользовательский интерфейс.
Ой! Попросите сервер включить исходную строку запроса в данные (json), которые он возвращает клиенту. Когда клиент получит обратно данные ajax, убедитесь, что результат / данные относятся к запросу («привет» / «привет, мир»), который соответствует тому, что в настоящее время находится в текстовом поле.
Существует плагин JQuery, который инкапсулирует то, о чем говорит предыдущий ответ. Он называется Тип Часы. Это позволяет функции запускаться после того, как пользователь прекратил вводить текст в текстовое поле в течение определенного количества миллисекунд. Я использовал его раньше, и он работает довольно хорошо.
Потрясающие! Спасибо всем, все ваши ответы были весьма содержательными. Реальная проблема, которую я узнал, заключалась в том, что я не знал, как отправлять переменные с этим запросом ajax. Это здесь.
$("#test").load("TempJumpToAJAX.aspx", {searchText: $("#").val()});
Также mintywalker, спасибо за понимание. Все было хорошо.