We Keep Coding

How to add input value using jQuery

So I have a form that submits device,color and the problem(with the device) and it displays the correct price underneath nicely using jQuery but I can't figure out how to insert the jQuery result into the hidden input value so that it also sends the price to next page(checkout page) Thanks :)
<form method="POST" action="../action.php">
<select class="custom-select mr-sm-2" name="device" id="inlineFormCustomSelect">
<option value="Motorola Edge">Moto Edge</option>
<option value="Motorola Edge Plus">Moto Edge Plus</option>
</select>
<select class="custom-select mr-sm-2" name="color" id="inlineFormCustomSelect">
<option selected>Select Color..</option>
<option value="Solar Black">Solar Black</option>
<option value="Midnight Magneta">Midnight Magneta</option>
</select>
<select class="custom-select mr-sm-2" name="issue" id="inlineFormCustomSelect3">
<option data-price="£0.00" data-total="" selected>Select Problem..</option>
<option data-price="£40.00" data-total="£42.00" value="Screen Repair">Damaged Screen</option>
<option data-price="£15.00" data-total="£15.75" value="Battery Replacement">Battery Replacement</option>
<option data-price="£35.00" data-total="£36.75" value="Audio Repair">Faulty Audio</option>
<option data-price="£35.00" data-total="£36.75" value="Mic Repair">Faulty Microphone</option>
<option data-price="£35.00" data-total="£36.75" value="Cam Repair">Faulty Camera</option>
</select>
<p><i id="price"></i>+Additional Fees</p>
<p>Total:<span id="total"></span></p>
<script type="text/javascript" language="javascript">
$(function(){
$('select').change(function(){
var selected = $(this).find('option:selected');
$('#price').html(selected.data('price'));
$('#total').html(selected.data('total'));
}).change();
});
*//This is some code I tried below//*
$(document).ready(function(){
$('input[id="price"];').val(price);
});
</script>
<input type="hidden" id="price" name="price" value=''>
<button type="submit" name="submit">

In the case that you are trying to use the same values in an entirely different page. You should know that JS variables do not automatically save, you will lose them after refreshing the page or loading another page.
In order to save variables in the browser, you can use localStorage or localSession. In this particular case, I suggest localSession. localSession will delete the data when the browser is close or the cache is cleared.
Also, you could remove the semicolon ';' from $('input[id="price"];').val(price)
I do not suggest using localStorage or localSession for important forms, this requires back-end. You could use PHP, Node, Django, or any back-end for managing forms. But what you tried was ultimatly right, it's just that there was no variable set to retrive the data from. Hence, why the input could be left empty.

One way you can do this is to update the hidden field when you update the text field.
$(function(){
$('select').change(function(){
var selected = $(this).find('option:selected');
$('#price').html(selected.data('price'));
$('#total').html(selected.data('total'));
$('#hiddenPrice').val(selected.data('price'));
}).change();
});
HTML:
<input type="hidden" id="hiddenPrice" name="hiddenPrice" value="">
Notes:
In your question, the hidden input has the same Id as the text field. That's not valid HTML. So give your hidden input a different Id (such as id='hiddenPrice'). Also, be aware that hidden fields can still be modified by a user. You should validate the posted price in your server side code to verify it is the correct price.

Try these
$('select[name="issue"]').on('change', function() {
var issue = parseFloat($(this).children("option:selected").data('price'));
$('input[name="price"]').val(issue);
// or this one below
$('input[name="price"]').val(issue).trigger('change');
});
Also, try changing the id of your hidden input field and remove or extract this '£' from the data-price.

How to pragramatically change a dropdownlist to another field's value

I have a dropdownlist with a list of countries (all countries)
<select id="Country" onchange="country();">
<option id="3">Japan</option>
<option id="4">Canada</option>
<option id="5">France</option>
<option id="6">Peru</option>
</select>
I have the form in a modal that i want get country value from.
<input id="seachcountry" type="text" class="form-control" name="country">
I have written a JQuery line to get the value from the modal form to the page fields, everything works great but the country select fields are not changing the value.
$("#seachcountry").val($("#modalform").val()).trigger("chang‌e");
thank you for your suggestions!

This will work for you:
Just inject the value of the <input> to <select>.
I have created a snippet for you.
var Tval = $('#seachcountry').val();
$('#Country').val(Tval);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="Country" onchange="country();">
<option id="3">Japan</option>
<option id="4">Canada</option>
<option id="5">France</option>
<option id="6">Peru</option>
</select>
<input id="seachcountry" type="text" class="form-control" name="country" value="France">

Try this.
function country() {
$("#seachcountry").val($(this).val());
}

For changing value in any select you just need send exist value from this select. In your select options have only ids, but not have value attribute. So if you add value equal to id to change value in the your form to "France" need run following:
$("#selectId").val(5)
Instead of 5 you can obtain value from any other field or else.
If you want set your value to input field when changed in select, you need attach listener that will do all work. It will looks like this:
$("#selectId").on("change", function(){
$("#inputFieldId").val($(this).find(":selected").text());
})
This will set displayed value to select, to set real value just write instead $(this).find(":selected").text() this $(this).val()

Get the last Select option value from a webbrowser control VB6

I need to get the value of the last option, from a box. "SelCONTACTS"
I have a webbrowser control in VB6 and i have it source code in a TextBox
<select name="SelCONTACTS" onchange="javascript:setTimeout('__doPostBack(\'SelCONTACTS\',\'\')', 0)" id="ctl00_ContentPlaceHolder1_ddlContratos">
<option selected="selected" value="30393">6-4002582</option>
<option value="194177">A-70P0096</option>
<option value="220499">B-7000902</option>
</select>
the name SelCONTACTS is a fixed name, it wont change. VALUES and CONTENTS of LIST ITEMS do change.
Only thing i can imagine is to search for the string and go a couple spaces back (but thats an horrible way to do it)
</option>
</select>

JS selection options onchange and post data

Hi I have an selection form which also changes between forms, meaning it's to choose between a product (also is the certain product) and post data after that.
<select class="select" name="product" style="width: 270px" onchange="location = this.options[this.selectedIndex].value;">
<option name="Product 1" selected value="orderform1.html">Product 1</option>
<option name="Product 2" value="orderform2.html">Product 2</option>
</select>
Switch between the product works fine, but post posts the data from the value, so i tried to to switch name and value and
location = this.options[this.selectedIndex].name;
But thats not working, any ideas hints what ever, thx for any help :)

Setting the value of an html element programmatically

I'm trying to create auto responder message templates with respect the the subject the visitor chooses. I checked formmail and I found how it's done as in setting up templates to be picked up from fmtemplate directory.
http://www.tectite.com/fmhowto/autorespond.php
However, before the auto-responder sends anything, I'd need to check the "Subject" selection and send the appropriate auto-responder template.
The way I think it should be done is as follows. Have the values of the select tag set like the following.
<select name="subject" id="subject" class="subject_category"">
<option value="first_option">First Option</option>
<option value="second_option">Second Option</option>
<option value="third_option">Third Option</option>
<option value="fourth_option">Fourth Option</option>
</select>
And some how have the following hidden tag instructed by formmail
to replace the file name of the autorespond HTML into the option chosen by the user.
Is there a way to embed javascript in place of arhtml.html file so it reads off the select option and constructs a html name accordingly?