I'm trying to use Krajee's Bootstrap Fileinput (http://plugins.krajee.com/file-input) and having some problems getting it to work with .Net MVC.
I'm doing a normal form submit (I need to do this because there is a lot of processing on the client side)
This is a cut down version of the code:
My model is:
public class AddFormModel
{
public string txtName { get; set; }
public HttpPostedFileBase[] fileUpload { get; set; }
}
Index.Html:
#model TestSystem.Models.AddFormModel
#{
Layout = null;
}
<!DOCTYPE html>
<html lang="">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/plugins/piexif.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/plugins/sortable.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/plugins/purify.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/fileinput.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/themes/fa/theme.min.js"></script>
</head>
<body>
<form id="frmMain" action="#Url.Action("AddObject", "Home")" method="post" enctype="multipart/form-data">
#Html.AntiForgeryToken()
<div class="container">
<div class="row">
<div class="form-group">
#Html.TextBoxFor(m => m.txtName, null, new { #required = "", #class = "form-control", data_val = "false" })
</div>
</div>
<div class="row">
<div class="form-group">
<div class="file-loading">
<input id="fileUpload" name="fileUpload" class="file" type="file" multiple data-min-file-count="1" data-upload-url="#">
</div>
</div>
</div>
</form>
<script>
$("#fileUpload").fileinput({
theme: 'fa',
showUpload: false,
showClose: false,
showRemove: false,
allowedFileExtensions: ['jpg', 'png', 'gif', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'pdf'],
overwriteInitial: false,
minFileCount: 0,
maxFileCount: 5,
maxFileSize: 4000,
validateInitialCount: true,
slugCallback: function (filename) {
return filename.replace('(', '_').replace(']', '_');
},
enctype: 'multipart/form-data',
fileActionSettings: {
showRemove: true,
showUpload: false,
showZoom: false,
showDrag: false,
}
});
</script>
</body>
</html>
My Controller:
public class HomeController : Controller
{
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult AddObject(AddFormModel model)
{
// ****When I look at the model here I only see 1 file ****
// model.txtName <- this is ok
// model.fileUpload <- If I just put one file in the upload
// I can see it
// model.fileUpload <- If I put more than one file in the upload
// I can only see the last one
}
}
UPDATE
I meant to put:
[HttpPost]
[ValidateAntiForgeryToken]
around the Controller method - my mistake when posting
If you want to upload more than one file, you need to use enctype="multipart/form-data" which you already have in form tag.
And Model list of HttpPostedFileBase to catch multiple files you have sent
public class AddFormModel
{
public string txtName { get; set; }
public IEnumerable<HttpPostedFileBase> fileUpload { get; set; }
}
All other parts seems fine to me.
UPDATE
I have tried your code it's working fine at my side when i posted form with more than one file all file has been retrieved in controller's method model.fileUpload.Count();
One more thing to notice [HttpPost] is on wrong place it should on the method rather than on controller class
Related
There is an error in my Login Controller, which I cannot figure out why. The error is for the line
Login user = db.Logins.Find(LoginStudentNumber);
it underlines db.Logins.Find(LoginStudentNumber); and say cannot implicitly convert type 'RMS.Models.Login' to RMS.Login
I made sure that I am using the correct table fields. Note: when typing the intellisence brings up "Logins" instead of "Login". It doesn't bring any errors for that part though
here is the rest of the code
Controller:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using RMS.DAL;
using RMS.Models;
namespace RMS.Controllers
{
public class LoginController : Controller
{
RMSContext db = new RMSContext();
[AllowAnonymous]
public ActionResult Login(string returnUrl)
{
ViewBag.ReturnUrl = returnUrl;
return View();
}
//
// POST: /Account/Login
[HttpPost]
[AllowAnonymous]
public ActionResult Login(Login model, int? LoginStudentNumber, string LoginPassword)
{
//Login user = db.Logins
Login user = db.Logins.Find(LoginStudentNumber);
if (user == null)
{
ModelState.AddModelError("", "Invalid User Id");
return View(model);
}
if (user.LoginPassword.Equals(LoginPassword))
{
return RedirectToAction("Index", "Home");
}
ModelState.AddModelError("", "Invalid Password");
return View(model);
}
}
}
View:
#model RMS.Models.Login
#{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Creative - Bootstrap 3 Responsive Admin Template">
<meta name="author" content="GeeksLabs">
<meta name="keyword" content="Creative, Dashboard, Admin, Template, Theme, Bootstrap, Responsive, Retina, Minimal">
<link rel="shortcut icon" href="img/favicon.png">
<title>Login</title>
<!-- Bootstrap CSS -->
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<!-- bootstrap theme -->
<link href="~/Content/bootstrap-theme.css" rel="stylesheet" />
<!--external css-->
<!-- font icon -->
<link href="~/Content/elegant-icons-style.css" rel="stylesheet" />
<link href="~/Content/font-awesome.css" rel="stylesheet" />
<!-- Custom styles -->
<link href="~/Content/style.css" rel="stylesheet" />
<link href="~/Content/style-responsive.css" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 -->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body style="background-color:white">
<img src="~/img/thrupps.png" style="width: 300px; height: 200px; margin: 0px 490px 0px 490px; " />
<div class="col-md-12">
<div class="login-wrap">
#using (Html.BeginForm("Login", "Login", System.Web.Mvc.FormMethod.Post, new { #class = "login-form" }))
{
<p class="login-img"><i class="icon_lock_alt"></i></p>
<div>
#ViewBag.Name1
</div>
<div class="input-group">
<span class="input-group-addon"><i class="icon_profile"></i></span>
#*#Html.TextBoxFor(a => a.LoginStudentNumber, "LoginStudentNumber", htmlAttributes: new { #class = "form-control" })*#
#Html.TextBoxFor(a => a.LoginStudentNumber, "LoginStudentNumber", htmlAttributes: new { #class = "form-control", type = "number" })
</div>
<div>
#ViewBag.Name2
</div>
<div class="input-group">
<span class="input-group-addon"><i class="icon_key_alt"></i></span>
#Html.TextBoxFor(a => a.LoginPassword, "LoginPassword", htmlAttributes: new { #class = "form-control" })
</div>
<input type="submit" id="button" class="btn btn-lg btn-success btn-block " value="Login" />
#Html.ValidationSummary()
}
</div>
</div>
</body>
</html>
Login Model:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
namespace RMS.Models
{
public class Login
{
public int LoginID { get; set; }
[Required]
public string LoginStudentNumber { get; set; }
[Required]
public string LoginPassword { get; set; }
}
}
This is because this line
Login user = db.Logins.Find(LoginStudentNumber);
db.Logins.Find() is returning RMS.Models.Login type and you are attempting to assign it to the type of RMS.Login
If you do this:
var user = db.Logins.Find(LoginStudentNumber);
It will fix that error as it will be implicitly typed. But you will probally get other errors due to it not being the type you expect.
What you need to do is map the value of user to the type of RMS.Login
Try adding this in your controller:
using Login = RMS.Models.Login;
This will tell controller, that you want to use your RMS.Models.Login in account controller for Login class. Or change explicitly where you want to use that model to this:
RMS.Models.Login user = db.Logins.Find(LoginStudentNumber);
When i run my login I cannot seem to pull through the LoginStudentNumber. It pulls through the password, but not the LoginStudentNumber. Please see what exaclty is wrong with my code.
Login Controller:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using RMS.DAL;
using RMS.Models;
namespace RMS.Controllers
{
public class LoginController : Controller
{
RMSContext db = new RMSContext();
[AllowAnonymous]
public ActionResult Login(string returnUrl)
{
ViewBag.ReturnUrl = returnUrl;
return View();
}
//
// POST: /Account/Login
[HttpPost]
[AllowAnonymous]
public ActionResult Login(Login model, int? LoginStudentNumber, string LoginPassword)
{
//Login user = db.Logins
Login user = db.Logins.Find(LoginStudentNumber);
if (user == null)
{
ViewBag.Name1 = "Invalid User ID";
return View();
}
else
{
if (user.LoginPassword.Equals(LoginPassword))
{
return View("../Home/Index", model);
}
else
{
ViewBag.Name2 = "Invalid Password";
return View();
}
}
}
}
}
Login View:
#model RMS.Models.Login
#{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Creative - Bootstrap 3 Responsive Admin Template">
<meta name="author" content="GeeksLabs">
<meta name="keyword" content="Creative, Dashboard, Admin, Template, Theme, Bootstrap, Responsive, Retina, Minimal">
<link rel="shortcut icon" href="img/favicon.png">
<title>Login</title>
<!-- Bootstrap CSS -->
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<!-- bootstrap theme -->
<link href="~/Content/bootstrap-theme.css" rel="stylesheet" />
<!--external css-->
<!-- font icon -->
<link href="~/Content/elegant-icons-style.css" rel="stylesheet" />
<link href="~/Content/font-awesome.css" rel="stylesheet" />
<!-- Custom styles -->
<link href="~/Content/style.css" rel="stylesheet" />
<link href="~/Content/style-responsive.css" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 -->
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body style="background-color:white">
<img src="~/img/thrupps.png" style="width: 300px; height: 200px; margin: 0px 490px 0px 490px; " />
<div class="col-md-12">
<div class="login-wrap">
#using (Html.BeginForm("Login", "Login", System.Web.Mvc.FormMethod.Post, new { #class = "login-form" }))
{
<p class="login-img"><i class="icon_lock_alt"></i></p>
<div>
#ViewBag.Name1
</div>
<div class="input-group">
<span class="input-group-addon"><i class="icon_profile"></i></span>
#Html.TextBoxFor(a => a.LoginStudentNumber, "LoginStudentNumber", htmlAttributes: new { #class = "form-control" })
</div>
<div>
#ViewBag.Name2
</div>
<div class="input-group">
<span class="input-group-addon"><i class="icon_key_alt"></i></span>
#Html.TextBoxFor(a => a.LoginPassword, "LoginPassword", htmlAttributes: new { #class = "form-control" })
</div>
<input type="submit" id="button" class="btn btn-lg btn-success btn-block " value="Login" />
}
</div>
</div>
</body>
</html>
Login Model:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
namespace RMS.Models
{
public class Login
{
public int LoginID { get; set; }
[Required]
public int LoginStudentNumber { get; set; }
[Required]
public string LoginPassword { get; set; }
}
}
and also to add, when I type the following code, I identifies "Logins" and not "Login" even though my table in titled "Login".
Login user = db.Logins.Find(LoginStudentNumber);
Whilst Michael Fung's answer did tickle me I believe this answer is what you're after...
Your logic action's parameter is spelt incorrectly. You put LoginStudentNumer when it should be LoginStudentNumber
public ActionResult Login(Login model, int? LoginStudentNumer, string LoginPassword)
Update
You can ensure the client enters a number by utilising the type attribute and setting its value to number.
#Html.TextBoxFor(a => a.LoginStudentNumber, "LoginStudentNumber", htmlAttributes: new { #class = "form-control", type = "number" })
Update 2
still having a problem. when i run the login page, it doesn't take me
to the home page when my username and password is correct,
The reason it doesn't take you to your home page is because the following is invalid
return View("../Home/Index", model);
You should be returning a redirect to the browser
return RedirectToAction("Index", "Home");
nor does it show me errors for when my username and password is
incorrect. could there be something wrong in the controller.
If you want to display the errors you can return the model along with any model state Errors.
public ActionResult Login(Login model, int? LoginStudentNumber, string LoginPassword)
{
//Login user = db.Logins
Login user = db.Logins.Find(LoginStudentNumer);
if (user == null)
{
ModelState.AddModelError("", "Invalid User Id");
return View(model);
}
if (user.LoginPassword.Equals(LoginPassword))
{
return RedirectToAction("Index","Home");
}
ModelState.AddModelError("", "Invalid Password");
return View(model);
}
Then in your view you would need to output the error message but using...
#Html.ValidationSummary()
i am new in mvc. so could not figure out what to add in code to show entered order no and selected product name and id.
here is full code and dotnetfiddle url https://dotnetfiddle.net/6vn2GO
Model code
using System;
using System.ComponentModel.DataAnnotations;
using System.Web.Mvc;
using System.Collections.Generic;
namespace HelloWorldMvcApp
{
public class OrderViewModel
{
[Display(Name = "Order number")]
public int? OrderNumber { set; get; }
[Display(Name = "Product")]
[Required(ErrorMessage = "Please select a product")]
public int SelectedProductId { set; get;}
public SelectList ProductList { get; set; }
}
public class Product
{
public int ID { set; get; }
public string Name { set; get; }
}
public static class Repository
{
public static IEnumerable<Product> FetchProducts()
{
return new List<Product>()
{
new Product(){ ID = 1, Name = "Ketchup" },
new Product(){ ID = 2, Name = "Mustard" },
new Product(){ ID = 3, Name = "Relish" }
};
}
}
}
Controller code
using System;
using System.Web.Mvc;
using System.Collections.Generic;
namespace HelloWorldMvcApp
{
public class HomeController : Controller
{
[HttpGet]
public ActionResult Index()
{
OrderViewModel model = new OrderViewModel();
model.OrderNumber=null;
ConfigureViewModel(model);
return View(model);
}
[HttpPost]
public ActionResult Index(OrderViewModel model)
{
if (!ModelState.IsValid)
{
ConfigureViewModel(model);
return View(model);
}
// save and redirect
// but for testing purposes
ConfigureViewModel(model);
return View(model);
}
private void ConfigureViewModel(OrderViewModel model)
{
IEnumerable<Product> products = Repository.FetchProducts();
model.ProductList = new SelectList(products, "ID", "Name");
}
}
}
View.cshtml code
#model HelloWorldMvcApp.OrderViewModel
#{
Layout = null;
}
<!DOCTYPE html>
<!-- template from http://getbootstrap.com/getting-started -->
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<!-- CSS Includes -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<style type="text/css">
.field-validation-error {
color: #ff0000;
}
</style>
</head>
<body>
<div class="container">
<div class="col-md-6 col-md-offset-3">
<h1>Hello Stranger</h1>
#using (Html.BeginForm())
{
<div class="form-group">
#Html.LabelFor(m => m.OrderNumber)
#Html.TextBoxFor(m => m.OrderNumber, new {#class="form-control"})
#Html.ValidationMessageFor(m => m.OrderNumber)
</div>
<div class="form-group">
#Html.LabelFor(m => m.SelectedProductId)
#Html.DropDownListFor(m => m.SelectedProductId, Model.ProductList, "-Please select-", new {#class="form-control"})
#Html.ValidationMessageFor(m => m.SelectedProductId)
</div>
<button type="submit" class="btn btn-success submit">Save</button>
}
</div>
</div>
<!-- JS includes -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
</script>
</body>
</html>
please tell me what code i need to add in view html to show entered order no and selected product name and id. thanks
You could set the value of your order number on the [HttpPost] Action method and check if it's null on the view side and show/hide stuff accordingly.
Another (probably better) alternative would be to just create a new view and return that when the model state is valid. To get the order number, you'll need to fetch the inserted ID from the database and pass that to the view.
Edit to show some code:
Controller Code:
using System;
using System.Web.Mvc;
using System.Collections.Generic;
namespace HelloWorldMvcApp
{
public class HomeController : Controller
{
[HttpGet]
public ActionResult Index()
{
OrderViewModel model = new OrderViewModel();
model.OrderNumber=null;
ConfigureViewModel(model);
return View(model);
}
[HttpPost]
public ActionResult Index(OrderViewModel model)
{
if (!ModelState.IsValid)
{
ConfigureViewModel(model);
return View(model);
}
// save and redirect
// but for testing purposes
ConfigureViewModel(model);
// you'll need to figure out how you're generating your
// order numbers
//
model.OrderNumber = 1; // just set this statically for now for POC
return View(model);
}
private void ConfigureViewModel(OrderViewModel model)
{
IEnumerable<Product> products = Repository.FetchProducts();
model.ProductList = new SelectList(products, "ID", "Name");
}
}
}
View Code:
#model HelloWorldMvcApp.OrderViewModel
#{
Layout = null;
}
<!DOCTYPE html>
<!-- template from http://getbootstrap.com/getting-started -->
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<!-- CSS Includes -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<style type="text/css">
.field-validation-error {
color: #ff0000;
}
</style>
</head>
<body>
<div class="container">
#{
if(Model.OrderNumber == null)
{
<div class="col-md-6 col-md-offset-3">
<h1>Hello Stranger</h1>
#using (Html.BeginForm())
{
<div class="form-group">
#Html.LabelFor(m => m.OrderNumber)
#Html.TextBoxFor(m => m.OrderNumber, new {#class="form-control"})
#Html.ValidationMessageFor(m => m.OrderNumber)
</div>
<div class="form-group">
#Html.LabelFor(m => m.SelectedProductId)
#Html.DropDownListFor(m => m.SelectedProductId, Model.ProductList, "-Please select-", new {#class="form-control"})
#Html.ValidationMessageFor(m => m.SelectedProductId)
</div>
<button type="submit" class="btn btn-success submit">Save</button>
}
</div>
} else {
<div>show your confirmation stuff here</div>
}
}
</div>
<!-- JS includes -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
</script>
</body>
</html>
that will reuse the same view, though as I said, I'd recommend using a different view.
Can someone please help me.
I cannot get my jQuery ui-dialog to validate.
I have tried to find a solution on this site and countless others but although everyone seems to have some sort of solution, I cannot get any of them to work.
I understand that it can sometimes be difficult to describe a problem so I have written a complete application that contains the minimum necessary to hopefully make things clear.
In the VIEW, there is an alert("saved"); which I do not want to see as the Dialog should prevent this getting that far.
Any suggestions will be most gratefully received.
CONTACTMESSAGE
using System.ComponentModel.DataAnnotations;
namespace TestValidation.Models
{
public class ContactMessage
{
[Required(ErrorMessage = "Message is Requried")]
public string Message { get; set; }
}
}
CONTROLLER:
namespace TestValidation.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult Edit()
{
return PartialView("MessageForm",
new ContactMessage{Message="Test"});
}
public ActionResult Save()
{
return Content("Saved");
}
}
}
VIEW:
#model TestValidation.Models.ContactMessage
#{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>ViewPage1</title>
<link href="#Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="Stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
</head>
<body>
Dialog
<div id="Placeholder" title=""></div>
</body>
</html>
<script type="text/javascript">
$(function () {
$("#Placeholder").dialog({
autoOpen: false, width: 400, height: 330, modal: true,
buttons: {
"Save": function () {
$.post("/Home/Save",
$("#EditForm").serialize(),
function (data) {
alert("saved");
$("#Placeholder").dialog("close");
});
},
Cancel: function () { $(this).dialog("close"); }
}
});
$("#editButton").click(function () {
$("#Placeholder").html("")
.dialog("option", "title", "Edit Message")
.load("/Home/Edit/", function () {
$("#Placeholder").dialog("open");
});
});
});
</script>
PARTIAL VIEW:
#model TestValidation.Models.ContactMessage
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
#using (Html.BeginForm("null", "null", FormMethod.Post, new { id = "EditForm" }))
{
#Html.ValidationSummary(true)
<div class="editor-label">
#Html.LabelFor(model => model.Message)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Message)
#Html.ValidationMessageFor(model => model.Message)
</div>
}
just after loading form into DOM do this
jQuery.validator.unobbstrusive.parse(jQuery('#EditForm'));
I want to validate form when click client button out of form, i tryed some method but all failed,help please?
source code:
#model MvcTest.Models.Movie
#{
ViewBag.Title = "Home Page";
Html.EnableClientValidation(true);
}
<script src="../../Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
#using (Html.BeginForm("TestValidate", "Home", FormMethod.Post, new { id = "tf" }))
{
#Html.LabelFor(m => m.Title)
#Html.EditorFor(m => m.Title)
#Html.ValidationMessageFor(m => m.Title)
}
<a onclick="test(event)" href="#">
<script type="text/javascript">
function test() {
//How to write here?
}
</script>
namespace MvcTest.Models
{
public class Movie
{
public int ID { get; set; }
[Required(ErrorMessage = "Error Message Test,I want you")]
public string Title { get; set; }
}
public class MovieDBContext : DbContext {
public DbSet<Movie> Movies { get; set; }
}
}
I invoked valid but ,it always warning the object form don't support this methord "validate()"
$(document).ready(function () {
$("#myform").validate();
$("test").click(function() {
alert("Valid: " + $("#myform").valid());
return false;
});
});
I have import js like this:
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/lib/jquery.delegate.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
or these:
<script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
You're looking for the valid method.