Chemory Gunko Chemory Gunko - 3 months ago 8
HTML Question

Using a ONE WORD javascript variable in form field VALUES

I have a function that gets values from a the URL and then posts it to various places on the page.

I can't figure out how to get the values to read inside form field values.

<OPTION Value="<script type="text/javascript">document.write(Position)
</script> has final say">


I know I can't do that specifically, but I've tried various configurations and nothing posts the variable inside the value field.

The document.write function is working on the plain html, I have tested that. I just don't know to make it read inside a form field value and display the results properly.

How do I get one word to display as a variable, without having to create a function that inputs the value of each field. There are way too many fields to make that viable - this needs to populate into maybe 200 or 300 variables, so I really need it to be the word.

The site is standalone so I can't use php as I understand it. If there's a way I'm open to it. I did try the php echo to call the field name but I don't know enough about php to know if I'm missing something.

I am open to solutions where I can upload files into the standalone site though.

Thanks in advance.

Answer

If you are stuck writing code only on the client-side, then you may want to use a client-side library like jQuery to help you manage your DOM manipulation.

For example, you can set a class for every variable you want to set and then use jQuery to replace the contents of those elements.

var values = {
  position: "top",
  name: "steve"
}
$(".position").text(values.position).val(values.position)
$(".name").text(values.name).val(values.name)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option class="position"></option>
  <option class="name"></option>
</select>
<select>
  <option class="name"></option>
</select>
<select>
  <option class="position"></option>
</select>
<select>
  <option class="position"></option>
  <option class="name"></option>
  <option class="position"></option>
  <option class="name"></option>
</select>