fill model's fields before post - asp.net-mvc

Question

i pass a model to my view . and it's fields are hiddenfor.
and my tds are here(in this view)
how can i say when i click on button(submit-btn2) , first my java script codes execute . and then my filled model will be post ?
my Partialview :
#Html.HiddenFor(m => m.username)
#Html.HiddenFor(m => m.Tell)
#Html.HiddenFor(m => m.Name)
#Html.HiddenFor(m => m.Mobil)
#Html.HiddenFor(m => m.Lname)
<button class="btn btn-medium btn-general input-block-level" id="submit-btn2" type="submit">save</button>
//all tds are here in this page(this view)
// $(document).ready(function () {
//$('#submit-btn2').click(function () {
//$("#username").val($(".tdBuyername").val());
//$("#Tell ").val($(".tdPhone").val());
//$("#Name ").val($(".tdRecievername").val());
//$("#Mobil ").val($(".tdMobile").val());
//$("#Lname ").val($(".tdLname").val());
//});
// });
<script type="text/javascript">
$("#submit-btn2").click(function () { saveMyModel();});
function SaveMyModel()
{
var e = document.getElementById("id_purchase");
var str = e.options[e.selectedIndex].value;
var e2 = document.getElementById("id_spend");
var str2 = e.options[e.selectedIndex].value;
$.ajax({
url: '#Url.Action("Save", "Home")',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
jsonMyModel: {
username: $(".tdBuyername").val(),
Tell: $(".tdPhone").val(),
Name: $(".tdRecievername").val(),
Mobil: $(".tdMobile").val(),
Lname: $(".tdLname").val(),
id_purchase: $("# id_purchase ").val(str),
id_spend: $("# id_spend ").val(str2),
}
})
});
}
Mycontroller:
[HttpGet]
public ActionResult Customer()
{
var obj = new Project.Models.ModelClasses.ViewModelX();
return PartialView(obj);
}
[HttpPost]
public JsonResult Save(ViewModelX jsonMyModel)
{
var result = true;
if (ModelState.IsValid)
{
result= MyClass.Insert (jsonMyModel.Address, jsonMyModel.Cod,
jsonMyModel.idpurchase,
jsonMyModel.idspend, jsonMyModel.Lname,
jsonMyModel.Name, jsonMyModel.Tell, jsonMyModel.username);
}
else
{
}
return Json(result, JsonRequestBehavior.AllowGet);
}
MyClass:
public class ViewModelX
{
public Nullable< long > idpurchase { get; set; }
public Nullable<long> idspend { get; set; }
public string username { get; set; }
public string Name { get; set; }
public string Lname { get; set; }
public string Tell { get; set; }
public string Address { get; set; }
public string CodPosti { get; set; }
}

Answer 1

Just add the following to the end of your click handler:
$('#myForm').submit();
Where myForm is the id attribute of your form.
Assuming your controller action accepts a parameter matching the class that your view is typed to, the model binder should take care of it as usual.

Answer 2

Are you using a strongly typed model?
What you have described can be done in two ways.
Using AJAX to post your data without page reload.
Using normal form post to post data.
Using AJAX
Having assumed that your controller method is like:
[HttpPost]
public JsonResult Save(MyModel jsonMyModel)
{
//do saving stuff
}
where , your model MyModel looks like
public class MyModel()
{
public string Username { get; set;}
public string Tell { get; set;}
public string Name { get; set;}
public string Mobile { get; set;}
public string LastName { get; set;}
}
You can create the model that your controller method accepts using normal jquery or javascript and post it using AJAX as below:
$("#submit-btn2").click(function () { saveMyModel();});
function SaveMyModel()
{
$.ajax({
url: '#Url.Action("Method", "SomeController")',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
jsonMyModel: {
Username: $("#username").val(),
Tell: $("#Tell ").val(),
Name: $('#listviewlabel').val(),
Mobile: $("#Name ").val(),
LastName:$("#Lname ").val()
})
});
}
Using normal form post
You can directly google out this thing. You can even find this in your account controller.