0

I have a field that must be created based on other fields in a form, so I added a modal confirmation to the submit event handler but even though the value appears in the modal correctly, it is not posting to the handler. Is there something I have to do special to insert a value into the $_POST object?

Here's my submit function:

$('form').submit( function(e){
    var occ = $('input:radio:[name=isDoubleOccupancy]:checked').val(),
          numBeds = $('select[name=numBeds]').val(),
          numBaths = $('select[name=numBaths]').val(),
          fpImage = '';

    if( parseInt(occ) == 1){
        fpImage = fpImage + 'do';
    } else if( parseInt(occ) == 2){
        fpImage = fpImage + 'to';
    } else {
        fpImage = fpImage + '';
    } // end if

    fpImage = fpImage + numBeds + "X" + numBaths + ".png";
    $('input[name=fpImage]').val( fpImage );

    if ( !confirm("Please request floor plan graphics named " + fpImage + " from the development team.")) { 
        return false;
    } // end if
}); // end form submit

The dump of an example POST:

Array (
[id] =>
[fpName] => Efficiency
[fpBullets] => Private bedroom with private bathroom; Approximately 1,399 square feet; Spacious walk-in closets
[fpSubBullets] =>
[numBeds] => 1
[numBaths] => 4
[isDoubleOccupancy] => 0
[fpRate] => 1600
[payPeriod] => Monthly
[numInstallments] => 12
[fpSpecial] => 0
[fpSpecialText] =>
[showHome] =>
[fpImage] =>
[fpSpecialURL] =>
[isSoldOut] =>
)

You can see that [fpImage] is posting NULL. I have looked for hours on Google, etc and the code seems right. Firebug shows no errors. I am officially frustrated.

Thanks in advance for your help.

Here's the HTML:

<div id="theEditor">
    <h2>EDIT FLOOR PLAN</h2>

    <form action="http://www.edrpo.com/WEBdev/index.php/conn/create_ind_floor_plan"
    method="post" accept-charset="utf-8">
      <label for="fpName">Floor Plan Name</label> <input type="text" name="fpName" value=
      "" /><br />
      <br />
      <label for="fpBullets">Floor Plan Main Bullets</label> 
      <textarea name="fpBullets" cols="40" rows="10">
</textarea><br />
      <span class="emphasisTxt">The following will display as a bulleted list. To enter,
      separate each bullet with a semicolon. Do not put a semicolon after the last
      bullet.<br />
      DO NOT USE THE ENTER OR RETURN KEY!</span><br />
      <br />
      <label for="fpSubBullets">Floor Plan Optional Bullets</label> 
      <textarea name="fpSubBullets" cols="40" rows="10">
</textarea><br />
      <span class="emphasisTxt">The optional bullets will display as a bulleted list at
      the bottom of the Floor Plans Info page. Use these to add temporary or suplemental
      information such as seasonal rates, etc. To enter, separate each bullet with a
      semicolon. Do not put a semicolon after the last bullet.<br />
      DO NOT USE THE ENTER OR RETURN KEY!</span><br />
      <br />
      <label for="numBeds">Number of Bedrooms</label> <select name="numBeds">
        <option value="">
          Please Select ...
        </option>

        <option value="0">
          Efficiency
        </option>

        <option value="1">
          One
        </option>

        <option value="2">
          Two
        </option>

        <option value="3">
          Three
        </option>

        <option value="4">
          Four
        </option>

        <option value="6">
          Dorm-style
        </option>
      </select><br />
      <br />
      <label for="numBaths">Number of Bathrooms</label> <select name="numBaths">
        <option value="">
          Please Select ...
        </option>

        <option value="1">
          One
        </option>

        <option value="2">
          Two
        </option>

        <option value="3">
          Three
        </option>

        <option value="4">
          Four
        </option>

        <option value="0">
          Dorm-style
        </option>
      </select><br />
      <br />
      <label for="isDoubleOccupancy">Unit Type</label> <input type="radio" name=
      "isDoubleOccupancy" value="0" checked="checked" id="isDoubleOccupancy" style=
      "margin:10px" />&nbsp;&nbsp;<span class='likeLabel'>Single-Occupancy</span>
      <input type="radio" name="isDoubleOccupancy" value="1" id="isDoubleOccupancy"
      style="margin:10px" />&nbsp;&nbsp;<span class='likeLabel'>Double-Occupancy</span>
      <input type="radio" name="isDoubleOccupancy" value="2" id="isDoubleOccupancy"
      style="margin:10px" />&nbsp;&nbsp;<span class=
      'likeLabel'>Triple-Occupancy</span><br />
      <br />
      <label for="fpRate">Rate</label> <input type="text" name="fpRate" value="" style=
      "width:80px;" /><br />
      <br />
      <label for="payPeriod">Pay Period</label> <select name="payPeriod">
        <option value="">
          Please Select ...
        </option>

        <option value="Monthly">
          Monthly
        </option>

        <option value="Semester">
          Semester
        </option>

        <option value="Biannual">
          Biannual
        </option>

        <option value="Annual">
          Annual
        </option>
      </select><br />
      <br />
      <label for="numInstallments">Number of Installments</label> <input type="text"
      name="numInstallments" value="" style="width:80px;" /><br />
      <br />
      <input type="radio" name="fpSpecial" value="1" id="fpSpecial" style=
      "margin:10px" />&nbsp;&nbsp;<span class='likeLabel'>Floor Plan Special ON</span>
      <input type="radio" name="fpSpecial" value="0" checked="checked" id="fpSpecial"
      style="margin:10px" />&nbsp;&nbsp;<span class='likeLabel'>Floor Plan Special
      OFF</span><br />
      <br />
      <label for="fpSpecialText">Floor Plan Special Text</label> 
      <textarea name="fpSpecialText" cols="40" rows="10">
</textarea><br />
      <span class="emphasisTxt">Floor Plan Special Text will display on the Floor Plans
      Info page for this floor plan.</span><br />
      <br />
      <label for="fpImage">Floor Plan Image</label> <input type="text" name="fpImage"
      value="" disabled="disabled" style="width:80px;" /><br />
      <br />

      <p style='text-align:center;'><input type="image" name="submit" value="" src=
      "http://www.edrpo.com/WEBdev/assets/images/update.png" /></p>
    </form>

    <p><br /></p>
  </div><!-- END theEditor DIV -->
4

2 回答 2

1

Your HTML markup is showing duplicate ID's and has other issues.

<label for="isDoubleOccupancy">Unit Type</label>

<input type="radio" name="isDoubleOccupancy" value="0" checked="checked" id="isDoubleOccupancy" style="margin:10px" />&nbsp;&nbsp;

<span class='likeLabel'>Single-Occupancy</span>

<input type="radio" name="isDoubleOccupancy" value="1" id="isDoubleOccupancy" style="margin:10px" />&nbsp;&nbsp;

<span class='likeLabel'>Double-Occupancy</span>

<input type="radio" name="isDoubleOccupancy" value="2" id="isDoubleOccupancy" style="margin:10px" />&nbsp;&nbsp;

<span class='likeLabel'>Triple-Occupancy</span>

To be sure, any ID can only be used once. Ditto for id="fpSpecial" and any other ID used.

EDIT: Per you message in my comment section:

This also applies to your name attributes.

They too are all the same and when your function sets the variable for var occ = $('input:radio:[name=isDoubleOccupancy]:checked').val() it will not function correctly since that value is always 0.

Because it's always 0, the custom value will never be submitted. My answer describes why you have this issue since fpImage = fpImage + ''; will always be the case, hence no image.

Solution: Use unique id and name attributes and modify your script accordingly.

于 2012-06-09T11:44:33.717 回答
0

You need a domready function so that all elements and changes can be found:

$(function() {//domready
    $('#form').submit(function() {
        // DO STUFF
        return true; // return false to cancel form action
    });
});
于 2012-06-09T11:38:54.590 回答