Изменить поле ввода перед отправкой

Question

Я должен закодировать доменное имя (IDNA) для конкретного регистратора, используя акценты.

У меня есть простое поле ввода:

<input type="text" id="idndomain" name="sld[0]" size="40" />

Моя функция jQuery

$(document).ready(function() { 
    $('#domainform').submit(function(){
        $.getJSON("includes/idna/idna.php", {
            domain: $("input#idndomain").val()
        }, function(data){
            $("div#result").html($('<b>' + data.encoded + '</b>'));
            $('#idndomain').val(data.encoded);
        });
        return true;
    });
}); 

Итак, я отправляю запрос к idna.php, который кодирует имя домена и возвращает массив json:

{"encoded":"xn--caf-dma.ch"}

Проблема в том, что форма отправляется с исходным значением, а не со значением, возвращаемым запросом json.

Вопрос: как сначала дождаться результата json, заменить поле ввода кодированной строкой и отправить их?

Answer 1

Попробуйте связать кнопку отправки вместо формы и явно вызвать обработчик submit формы в обратном вызове вызова json:

    $(document).ready(function() { 
            $('#submitButton').click(function(){

                    // maybe disable the submit button once clicked?
                    $(this).attr('disabled', true); 
                    $.getJSON("includes/idna/idna.php", {
                            domain: $("input#idndomain").val()
                    }, function(data){
                            $("div#result").html($('<b>' + data.encoded + '</b>'));
                            $('#idndomain').val(data.encoded);
                            // now submit the form
                            $('#domainform').submit();
                    });
                    return false;
            });
    });