1

I have a page which list all Countries in a tabular form and view has a model like below:

public class CitySet
{
    public IEnumerable<CityObject> Cities { get; set; }

    [Required]
    public string City { get; set; }

    [Required]
    public string CityCode { get; set; }

}


On the same page I have a link that allows the user to create a new Country via a modal popup(defined within that page)
Modal Popup section of the page is shown below:

@model CMS.Models.CitySet

<div class="box-header well" data-original-title="">
            <h2>
              <a operation="add" id="btnNewCity" data-toggle="modal" data-target="#myModal" href="#">Add New City</a>
            </h2>

        </div>
        <div class="box-content">  

@*Below table is to show all the added Cities in the tabular format on the page itself*@

            <table id="myDataTable" class="table table-striped table-bordered ">
                <thead>
                    <tr>
                        <th>City</th>
                        <th>Country </th>
                        <th>Creation Date</th>

                    </tr>
                </thead>
                <tbody>
                    @foreach (var item in Model.Cities)
                    {
                        <tr id="@item.CityID">
                            <td>@item.City</td>
                            <td>@item.CountryName</td>
                            <td>@item.CreatedDate</td>
                            <td>
                                <a href="" class="model_edit" operation="edit">Edit</a>
                                <a href="" class="model_edit" operation="delete">Delete</a>
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
        </div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
@using (Html.BeginForm("ManageCity", "Admin", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">Add City</h4>
            </div>

<div class="modal-body">
 <div class="form-group">
                     <label for="City"> City </label>
                     @Html.TextBoxFor(model => model.City)
                     @Html.ValidationMessageFor(model=>model.City)
  </div>
  <div class="form-group">
                     <label for="CityCode"> City Code </label>
                     @Html.TextBoxFor(model => model.CityCode)
                     @Html.ValidationMessageFor(model=>model.CityCode)                
   </div>
 <button type="submit" id="addNewCity" class="btn btn-primary">Save changes</button>
}
</div>
</div>
</div>


The javascript that triggers the modal popup is :

$(".model_edit").click(open_model_form);

function open_model_form(e) {       
        e.preventDefault();                    
        if ($(e.currentTarget).attr("operation") == "add") {
            //open popup
            $('#myModal').modal('show'); 
   }        
}



[HttpPost, ValidateInput(true)]
    public ActionResult ManageCity(FormCollection formData)
    {
       //Some data saving Operation
    }

The behavior that I am seeing is when both the textboxes are empty and user presses Submit Button it shows Validation message against both, but if I enter value in any ONE of them, and press SUBMIT, it start posting the form, i.e. to Action "ManageCity" and does not check for Client side validation on the other textbox.

I have already included both Validate.js and UnObstrusive.js files on my layout page of this form page

CuriousBuddy
  • 179
  • 1
  • 8
  • 21
  • can you post rendered html ? – Mohsen Esmailpour Dec 20 '14 at 16:13
  • Unlike forum sites, we don't use "Thanks", or "Any help appreciated", or signatures on [so]. See "[Should 'Hi', 'thanks,' taglines, and salutations be removed from posts?](http://meta.stackexchange.com/questions/2950/should-hi-thanks-taglines-and-salutations-be-removed-from-posts). – John Saunders Dec 20 '14 at 19:46
  • @mo.esmp after submitting with both empty it looks like ' The CurrencyName field is required.' – CuriousBuddy Dec 20 '14 at 22:09
  • Based on your previous question, Your model `CitySet` looks wrong (you should have a property for a complex object that contains properties `City` and `CityCode`. And your post method should be binding to your model (not `FormCollection`) `public ActionResult ManageCity(CitySet model)`. Your last comment indicates a property `CurrencyName` which you don't have, so you appear to have posted the wrong code. –  Dec 21 '14 at 00:06
  • @StephenMuecke Thanks, but I am not clear on your first point. I already have two properties City and CityCode in model that you mentioned. Can you post a snippet to help me understand. Secondly I tried changing FormCollection to CitySet Model like public ActionResult ManageCity(CitySet model) but it did not help. And yes, I wrongly posted the code for currency. – CuriousBuddy Dec 21 '14 at 15:07
  • What your claiming is not the default behavior so there is something else wrong. You need to post the full view so I an understand whats wrong. –  Dec 21 '14 at 20:43
  • @StephenMuecke - Edit my question with full view and javascript to trigger the popup – CuriousBuddy Dec 22 '14 at 07:59
  • Can't see any obvious reason form the code you have posted why you would get that behavior. One possibility is that the validator is not parsing the controls because they are initially hidden. You could try parsing the validator immediately after its shown - [refer this answer](http://stackoverflow.com/questions/26542509/validate-dynamically-added-fields/26542591#26542591) –  Dec 22 '14 at 11:27

0 Answers0