Запрос на отправку AJAX и конкатенация строк

Я использую jQuery/AJAX для выполнения запроса по почте. Я пытаюсь принять входные данные из первого текстового поля и объединить его с URL-адресом и отображением результата во втором текстовом поле. Пример. Если пользовательские типы в asdf, функция ajax затем сделает сообщение, и результат будет отображаться как http://www.example.com/sdf/. У меня есть две проблемы. Как уже упоминалось ранее, у меня есть функция ajax, которая выполняет пост, но результат не является diplaying в html (он показывает в консоли firebug). Во-вторых, как я могу конкатенировать ввод в URL-адрес. Live Site Запрос на отправку AJAX и конкатенация строк

<script> 
$(document).ready(function() { 
    var timer = null; 
    var dataString; 

    function submitForm() { 
     $.ajax({ 
      type: "POST", 
      url: "/concatenate/index.php", 
      data: dataString, 
      dataType: "html", 
      success: function (data) { 
       $("#result").html(data); 
      } 
     }); 
     return false 
    } 
    $("#input").on("keyup", function() { 
     clearTimeout(timer); 
     timer = setTimeout(submitForm, 40); 
     var input = $("#input").val(); 
     dataString = { input : input } 
    }) 
}); 
</script> 
</head> 
<body> 

<h1>Enter a word:</h1> 

<form action="create_entry.php" method="post"> 
Input: <input type="text" id="input" name="zipcode"></br> 
Concatenated Result: <input type="text" id="result" name="location" value="http//www.example.com/ /" readonly></br> 
</form>

источник

2013-11-09 user2970730

использование $ ("# результат") вал (данные). вместо $ ("# result"). html (data); –

Я хотел бы предложить вам передать параметры в submitForm вместо использования глобальной переменной для данных.

Чтобы выполнить конкатенацию, можно сохранить исходное значение ввода с использованием метода .data() и всегда его захватить, а затем добавить к нему новое значение.

<!-- remove extra space and "/" --> 
<input type="text" id="result" name="location" value="http//www.example.com/" readonly>

$(document).ready(function() { 
    var timer = null; 
    /* cache $("#result") and store initial url value*/ 
    var $result=$("#result"); 
    $result.data('url',$result.val()); 

    function submitForm(input) { 
     $.ajax({ 
      type: "POST", 
      url: "/concatenate/index.php", 
      data: {input:input}, 
      dataType: "html", 
      success: function (data) { 
       /* new value from stored url and new user input*/ 
       var url=$result.data('url'), 
       newUrl= url+data; 
       /* use val() not html() */ 
       $result.val(newUrl); 
      } 
     }); 
     return false 
    } 


    $("#input").on("keyup", function() { 
     /* no point using "$("#input")" to search DOM again when already have "this"*/ 
     var input = $(this).val(); 
     clearTimeout(timer); 
     timer = setTimeout(function(){ 
      submitForm(input) ; 
     }, 40); 


    }) 
});

источник

2013-11-09 16:22:28 charlietfl

Ничего не отображается, проверяется в консоли firebug и даже не выполняется почтовый запрос. [Ссылка] (http://webprolearner.ueuo.com/concatenate/) – user2970730

OK сделало быстрое исправление кэширования значение – charlietfl

Мне нравится этот подход и внес изменения, но почему он все еще отображает всю страницу html? – user2970730

должно быть

success: function (data) { 
    $("#result").val('http//www.example.com/'+data+'/'); 
}

источник

2013-11-09 16:07:36

Chage это

success: function (data) { 
       $("#result").html(data); 
      }

к этому

success: function (data) { 
     $("#result").attr('value','http//www.example.com/'+data+'/'); 
}

источник

2013-11-09 16:13:27 user2511140

это просто не правильно ... input имеет значение не innerHtml – charlietfl

моя ошибка обновленный код – user2511140

Мне нравится, куда вы идете, но добавляет всю страницу html в конец результата. См. [Link] (http://webprolearner.ueuo.com/concatenate/) – user2970730

Запрос на отправку AJAX и конкатенация строк

ответ

Смежные вопросы