Prepopulate text field in a JQUERY with a URL parameter value

Question

I want to pre - populate text box (and gray it out for editing) with a URL parameter value inside a jquery snippet of code:

The Jquery code:

jQuery(document).ready( function () {
        $("#append").click( function(e) {
          e.preventDefault();
        $(".inc").append('<div class="controls">\
                <input class="form-control" type="text" name="textbox" placeholder="email">\
                <input class="form-control" type="text" name="text" placeholder="@domain">\
                <a href="#" class="remove_this btn btn-danger">remove</a>\
                <br>\
                <br>\
            </div>');
        return false;
        });

    jQuery(document).on('click', '.remove_this', function() {
        jQuery(this).parent().remove();
        return false;
        });
    $("input[type=submit]").click(function(e) {
      e.preventDefault();
      $(this).next("[name=textbox]")
      .val(
        $.map($(".inc :text"), function(el) {
          return el.value
        }).join(",\n")
      )
    })
  });

The specific text field i want to prepopulate :

<input class="form-control" type="text" name="domain" placeholder="@domain">\

The function i have for obtaining the said parameter value:

function GetURLParameter(sParam)

    {

        var sPageURL = window.location.search.substring(1);

        var sURLVariables = sPageURL.split('&');

    for (var i = 0; i < sURLVariables.length; i++)

    {

        var sParameterName = sURLVariables[i].split('=');

        if (sParameterName[0] == sParam)

        {

            return sParameterName[1];

        }

    }

}

I don't see a specific question or a description for a specific issue. Could you please clarify what exactly is not working as you expect? — lurker, Aug 04 '20 at 18:58
I need to make the value of the 'domain' field a URL parameter value in other words the URL: http://test.com/?domain=mydomain I need to know how to prepupolate that inside the first snippet of the JQUERY code — Screwtape007, Aug 04 '20 at 19:04
i used the following value="${domain}" but the text box only just contains that exact same text and doesnt evaluate to the value of what 'domain' is — Screwtape007, Aug 04 '20 at 21:02
You have the syntax incorrect for expressions in strings. You want, `value =\`${domain}\``. But not sure you wouldn't just write, `value = domain` if `domain` is a string. But I'd need to see more context. — lurker, Aug 04 '20 at 21:49
There are many duplicates here on SO, have you tried those? https://stackoverflow.com/questions/50695292/get-url-parameters-with-jquery-and-display-them-inside-an-html-input-text-field, https://stackoverflow.com/questions/3680060/parsing-the-url-querystring-using-jquery-and-inserting-the-value-in-a-textbox, https://stackoverflow.com/questions/16188151/populate-input-field-from-url-variable-using-either-javascript-or-jquery ... — Don't Panic, Aug 04 '20 at 23:47
If none of them help, just [get the URL `parameter`](https://stackoverflow.com/questions/19491336/how-to-get-url-parameter-using-jquery-or-plain-javascript), and `$('input[name="domain"]').val(parameter);`. — Don't Panic, Aug 04 '20 at 23:49
Does this answer your question? [Get URL parameters with jQuery and display them inside an HTML input text field](https://stackoverflow.com/questions/50695292/get-url-parameters-with-jquery-and-display-them-inside-an-html-input-text-field) — Don't Panic, Aug 04 '20 at 23:50

score 0 · Answer 1 · answered Aug 04 '20 at 23:18

0

$('#selector').val('value you want to input here')

https://api.jquery.com/val/

answered Aug 04 '20 at 23:18

destroyer22719

356
2
6

score 0 · Answer 2 · answered Aug 05 '20 at 12:53

It turns out the solution is using backticks on the html snippet of coded within the JQUERY like this:

        $(".inc").append(`<div class="controls">\
                <input class="form-control" type="text" id="email" name="email" placeholder="email">\
                <input class="form-control" type="text" id="domain" name="domain"  value="${domain}">\
                <a href="#" class="remove_this btn btn-danger">remove</a>\
                <br>\
                <br>\
            </div>`
           
            );

Prepopulate text field in a JQUERY with a URL parameter value

2 Answers2