0

The web page I'm working on has a 'main' form where the visitor enters personal data and information about a first property. If he/she has further properties to record, he/she clicks an 'add property' checkbox, which dynamically generates a new (partial) form).

I'm using #PSL's answer to the question How to use jQuery to add form elements dynamically to build a form that can be reloaded and completed multiple times on the same page. I have been able to change the input IDs and names so that they are all unique, and it all works well that far, including adding all the info to a database when submitted.

I am now trying to add (the same) default values to some of the inputs on each form. This too needs to be dynamic because each input has a different ID. My working can be seen on JSFiddle https://jsfiddle.net/ramasaig/yrpoo6v7/ (shown with the static selector, see below)

The first problem seems to lie with the jQuery selector. If I make it static as:

$('#pc2').val('PA66 6BP');

then it will work (but only when the NEXT form is created, see second problem). And of course it only applies the default value to the input with id = 'cp2'. If I try to create the ID using a variable, like:

$('#pc' + prop_no).val('PA66 6BP');

it fails without producing a console error. I've looked at the elements using 'Inspector' and the IDs are there OK, but not the values.

The second problem is that even when I use the static $selector the value doesn't appear in the 'first' form until I create the second (which makes me wonder if the first problem might be to do with the timing, but I am unsure how to check for this or what to do about it.).

So my questions are:
1. How do I select the ID dynamically ?
2. How do I get the default value to show up when the form is created.

I'd be grateful for some help here, please.

Community
  • 1
  • 1
Tim Dawson
  • 89
  • 2
  • 9
  • 1
    assuming your default values are same ,every time you load form , pure HTML solution is to add attribute `value='default value'` for all input elements. [demo](https://jsfiddle.net/SantoshPandu/yrpoo6v7/14/) – J Santosh Sep 09 '15 at 11:40
  • I should have explained that the defaults are not 'the same' in the sense of being permanent, but derived from the initial form. e.g whatever Post Code is put in the initial form it should be repeated in all the dynamically generated ones. The initial form isn't shown in my JSFiddle demo so I have inserted a fixed value – Tim Dawson Sep 09 '15 at 11:56
  • then i suggest use class names for short and simple code to set default values using jQuery – J Santosh Sep 09 '15 at 11:59
  • Thanks, I'll give it a try. The class names can be fixed for all 'post code' inputs (and others), so should be easier than with dynamic IDs. – Tim Dawson Sep 09 '15 at 12:44
  • Someone called Arun... sent a message to my inbox which was also very helpful, but when I tried to add a comment to the message as displayed it was not permitted. Now that entry has vanished from my inbox. So thanks, Arun, it worked. – Tim Dawson Sep 09 '15 at 13:01

0 Answers0