Problems when combine several fields to 1 input field
<p>I have some codes to combine several fields and pass to 1 input field F on user's profile page. After loading, #Salary_para1 will pass value to field F first, then when user enter value in #Salary_value, it will pass its value to field F too. Same condition with checkbox #Salary_para2.</p>

<p>There is problem after user save their profile page. Let say, field F have value "MYR1000 + Allowance" after saved. After loading, field F still shown value of #Salary_para1 ('MYR' in sample) instead of "MYR1000 + Allowance". </p>

<p>1) How to make sure that field F shown "MYR1000 + Allowance" after loading??
2) How to make it don't pass value of #Salary_para1 (MYR) if user didn't input value to #Salary_value?
3) How to make sure that if field F after loading have value of "MYR" and "+ Allowance", then field #Salary_para1 will show 'MYR' and checkbox #Salary_para2 will be checked? (revert back)</p>

<p><a href="http://jsfiddle.net/e2ScF/69/" rel="nofollow">http://jsfiddle.net/e2ScF/69/</a></p>

<p>CODE:</p>

<pre><code>&lt;select id="Salary_para1"&gt;
  &lt;option value=""&gt;Choose...&lt;/option&gt;
  &lt;option value="0" selected&gt;MYR&lt;/option&gt;
  &lt;option value="1" &gt;SGD&lt;/option&gt;
&lt;/select&gt;
&lt;input id="Salary_value" type="text"/&gt;
 + &lt;input type="checkbox" id="Salary_para2" name="Salary_para2" value=" + Allowance"  /&gt;Allowance&lt;br/&gt;
&lt;input type="text" id="targetTextField" name="targetTextField" size="31" tabindex="0" maxlength="99" value="MYR1000 + Allowance"&gt;

$(function() {
setTarget();
$("#Salary_para1,#Salary_para2").change(setTarget);
$("#Salary_value").keyup(setTarget);

function setTarget() {
    var tmp = $("option:selected", "#Salary_para1").text();
    tmp += $("#Salary_value").val();
    tmp += $("#Salary_para2:checked").val() || '';
    $('#targetTextField').val(tmp);
}
});
</code></pre>
