Add placeholder text to input fields

Cody Jaster asked on December 18, 2017 23:47

I am attempting to insert placeholder values for form input fields instead of the Watermark text. Straight Javascript works fine for initial page load, but is obviously not run on UpdatePanel partial postback. We need the placeholder text rather than Watermark text since no labels are present for the form input fields.

Tried various methods to resolve this including _endRequest method. In doing so, the original fields with dependance are unchanged, while the Javascript runs.

For example we want to run the following Javascript on page load and any subsequent partial page load:

document.querySelector(".datePicker input").placeholder = "dd/mm/yyyy";

Meanwhile, we have a Country field that has State dependent, and if Country.Value == "United States" it is visible.

If we insert the following, the datepicker placeholder is retained, but the logic for the visible State field is ignored.

var prm = Sys.WebForms.PageRequestManager.getInstance();
    if (prm != null) {
        prm.add_endRequest(function (sender, e) {
            if (sender._postBackSettings.panelsToUpdate != null) {
                document.querySelector(".datePicker input").placeholder = "dd/mm/yyyy";
            }
        });
    };

Is there a better method to accomplish simple placeholder text while retaining form functionality?

Recent Answers


Hanh Dang answered on December 19, 2017 09:18 (last edited on December 19, 2017 09:19)

You can use method ScriptManager.RegisterStartupScript. It will register a script block to page after postback (in case you use IsPostback condition), then the script/function in script block will be executed

Read more here https://msdn.microsoft.com/en-us/library/bb310408(v=vs.110).aspx

0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.