We help IT Professionals succeed at work.

how to post hidden input from split input text

Johnny
Johnny used Ask the Experts™
on
i want to be able to split a text box i have that populates from jquery
and make it pass via post with split values

 
<li id="li-4-11"><label id="label-4-11" for="cf4_field_11"><span> Zip code (autofill for USA only)</span></label>&nbsp;<input type="text" name="mailing_zipcode" id="mailing_zipcode" maxlength="5" title="Enter Zip Code for autofill" class="number" value="" onkeydown="javascript:maskInput()"/></li>
<li id="li-4-11"><label id="label-4-11" for="cf4_field_11"><span> City/State/Zip (Will auto fill if zip code is entered above)</span></label>&nbsp;<input type="text" name="city_sate_zip" id="city_sate_zip" title="Enter Zip Code above for autofill"class="single" value=""/></li>

Open in new window


then i have it parsing for the info
 
$("#mailing_zipcode").bind("blur", function(e){
                var EnteredValue = $.trim($("#mailing_zipcode").val());
                var TestValue = EnteredValue.replace(" ", "");
                //alert(EnteredValue);
                //alert(TestValue);
                 if (isNaN(TestValue)) {
                         alert("You must enter 5 Numbers only, for valid Zip Code")
                         $("#mailing_zipcode").val("");
                         $("#city_sate_zip").val("");
                }
                else {
//alert ($("#zip").val());
  $.getJSON("zip_lookup.php?zip=" + $("#mailing_zipcode").val(),
        function(data){
          $.each(data, function(i,item){
            if (item.field == "city_sate_zip") {
            //alert(item.field);
              $("#city_sate_zip").val(item.value);
              //alert(item.value);
            }
          });
        });
        }
});

Open in new window

and this all works great

my problem is the city and state are now on one line city_sate_zip
i need it to pass as post
mailing_city
mailing_state

how do i do i separate the values and pass them via hidden inputs please

im using jquery and php in my page if that helps

thank you in advance for any code or help you may provide

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
It seems to me that you need to put something in between the mailing_city and mailing_state

eg:
Lewiston:ID

when returning from php, and then spilt and you can get each out to move where ever.. now if you have the hidden input in the DOM it's just a .val(foo) that you need... if you don't then you want to do something like

$('form').append('<input type="hidden" value="'+foo+'" />');

add names and ids as needed.. That I think will take care of what you need.. Cheers -Jeremy
Greg AlexanderLead Developer

Commented:
what are the city state and zip separated by?

Author

Commented:
@galexander07
currently the zip info populates the city_state_zip field with
Marysville,OH 43040
and this is how json returns
[{"field":"city_sate_zip","value":"Marysville,OH 43040"}]

@jeremyBass26
that sounds like the right track but how do i split the values up.

this is what ill need from input
<input type="text" name="city_sate_zip" id="city_sate_zip" title="Enter Zip Code above for autofill"class="single" value=""/>

parsed into

$('cmxform').append('<input type="hidden" name="mailing_city" value="Marysville'" />');
$('cmxform').append('<input type="hidden" name="mailing_state" value="OH'" />');

it would need to parse this value right upon submit
$("#city_sate_zip").val()

*** yes i know its spelled wrong but i didnt want to break it as it works to auto fill in city,state and zip info from zip lookup


Lead Developer
Commented:
Try this
$("#mailing_zipcode").bind("blur", function(e){
                var EnteredValue = $.trim($("#mailing_zipcode").val());
                var TestValue = EnteredValue.replace(" ", "");
                //alert(EnteredValue);
                //alert(TestValue);
                 if (isNaN(TestValue)) {
                         alert("You must enter 5 Numbers only, for valid Zip Code")
                         $("#mailing_zipcode").val("");
                         $("#city_sate_zip").val("");
                }
                else {
//alert ($("#zip").val());
  $.getJSON("zip_lookup.php?zip=" + $("#mailing_zipcode").val(),
        function(data){
          $.each(data, function(i,item){
            if (item.field == "city_sate_zip") {
            //alert(item.field);
              	$("#city_sate_zip").val(item.value);
				first_split = item.value.split(',');
				second_split = first_split[1].split(' ');
                
              	$('cmxform').append('<input type="hidden" name="mailing_city" value="'+first_split[0]+'" />');
				$('cmxform').append('<input type="hidden" name="mailing_state" value="'+second_split[0]+'" />');
              //alert(item.value);
            }
          });
        });
        }
});

Open in new window

Author

Commented:
$('form.cmxform').append('<input type="hidden" name="mailing_city" value="'+first_split[0]+'" />');
$('form.cmxform').append('<input type="hidden" name="mailing_state" value="'+second_split[0]+'" />');

had form name wrong but works great thx

Author

Commented:
@jeremyBass26

thanks for the nifty explanation, i understand the code now thx