I have a page with an <asp:FileUpLoad> tag that I place a glyphicon into. When I click on the submit button without selecting a file, bootstrapvalidator flags the field as invalid and displays the error message. The issue is that the glyphicon icon gets stretched to include the <asp:FileUpLoad> field and the bootstrap error message.
This is what the form looks like prior to clicking on Submit:
and this is what it looks like after I click on Submit:
Here is the code that I am running:
<head runat="server">
<title></title>
<script src="../Scripts/modernizr-2.6.2.js"></script>
<link href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
<link id="Link1" rel="stylesheet" type="text/css" href="../Content/bootstrap.css" />
<link id="Link2" rel="stylesheet" type="text/css" href="../Content/bootstrapValidator.min.css" />
<link id="Link3" rel="stylesheet" type="text/css" href="../Content/bootstrap-datepicker.min.css" />
<link id="StyleLink1" rel="stylesheet" type="text/css" href="../Content/Site_VSTT.css"/>
<script src="../Scripts/jquery-1.10.2.js" type="text/javascript"></script>
<script src="../Scripts/respond.js" type="text/javascript"></script>
<script src="../Scripts/moment.js" type="text/javascript"></script>
<script src="../Scripts/bootstrap.js" type="text/javascript"></script>
<script src="../Scripts/bootstrap-datetimepicker.js" type="text/javascript"></script>
<script src="../Scripts/bootstrapValidator.js" type="text/javascript"></script>
</head>
<body>
<form runat="server" id="contactForm" class="form-horizontal" >
<div class="form-group">
<label class="col-md-3 control-label">File Name</label>
<div class="col-md-6 input-group">
<span class="input-group-addon">
<i class="glyphicon glyphicon-file"></i>
</span>
<asp:FileUpload ID="uploadfile" name="uploadfile" CssClass="form-control" runat="server" ClientIDMode="Static" placeholder="Enter name of file to upload"/>
</div>
<br /><br />
<div class="col-md-1 col-md-offset-3">
<asp:LinkButton ID="btnCancel" runat="server" CssClass="btn btn-default btn-sm">
<span aria-hidden="true" class="glyphicon glyphicon-remove"></span> Cancel
</asp:LinkButton>
<button id="btnSubSearch" runat="server" type="submit" class="btn btn-primary btn-sm" >
<span aria-hidden="true" class="glyphicon glyphicon-arrow-right">
</span> Validate
</button>
</div>
</div>
</form>
<script>
$(document).ready(function () {
$('#contactForm')
.bootstrapValidator({
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
uploadfile: {
validators: {
notEmpty: {
message: 'The file name is required'
}
}
}
}
})
})
</script>
</body>
Related
Goodday,
Very confused. Dazzled. Everything.. :-) I have made a page...this is the page:
<%# Page Language="VB" AutoEventWireup="false" CodeFile="Contact.aspx.vb" Inherits="Contact" %>
<!DOCTYPE html>
<html lang = "en">
<head runat="server">
<title>blabla</title>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="bl" />
<meta name="keywords" content="blabla" />
<meta name="author" content="blabla" />
<link rel="icon" href="images/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/bootstrap-responsive.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript" src="js/jquery.ui.totop.js"></script>
<script type="text/javascript" src="js/cform.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<script>
$(document).ready(function () {
//
}); //
</script>
<!--[if lt IE 8]>
<div style='text-align:center'><img src="http://www.theie6countdown.com/images/upgrade.jpg"border="0"alt=""/></div>
<![endif]-->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<link rel="stylesheet" href="css/ie.css" type="text/css" media="screen">
<![endif]-->
</head>
<body class="not-front">
<form id="form1" runat="server">
<div>
<div id="main">
blabla
<div id="inner">
<div class="top2_wrapper">
<div class="bg1"><img src="images/bg1.jpg" alt="" class="img" /></div>
<div class="top2_inner">
<div class="container">
<div class="top2 clearfix">
<h1>contact us</h1>
<div class="breadcrumbs1">Home<span></span>Pages<span></span>Contacts</div>
</div>
</div>
</div>
</div>
<div id="content">
<div class="container">
<div class="row">
<div class="span9">
<h2><span>blabla</span></h2>
<figure class="google_map">
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d3894.331481453587!2d99.95368306057432!3d12.5603807486186!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xbaa61d3b0e1607b0!2sBaan%20Khun%20Por%20Hotel!5e0!3m2!1sen!2sth!4v1574141019645!5m2!1sen!2sth" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen=""></iframe>
</figure>
<h3>blabla</h3>
<p>
blabla<br />
blabla<br />
blabla<br />
blabla
</p>
</div>
<div class="span3">
<h2><span>blabla</span></h2>
<ul class="ul1">
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
<li>blabla</li>
</ul>
</div>
</div>
<div class="row">
<div class="span12">
<h2 class="center"><span><%=bt.gettext("contactform", Session("lang"))%></span></h2>
<div id="note"></div>
<div id="fields">
</div>
<div class="row">
<div class="span4">
<div class="control-group">
<label class="control-label" for="inputName">NAme</label>
<div class="controls">
<input runat="server" class="span4" type="text" id="inputName" name="name" value="Your full name:" onBlur="if(this.value=='') this.value='Your full name:'" onFocus="if(this.value =='Your full name:' ) this.value=''">
</div>
</div>
</div>
<div class="span4">
<div class="control-group">
<label class="control-label" for="inputEmail">Email</label>
<div class="controls">
<input runat="server" class="span4" type="text" id="inputEmail" name="email" value="Your email:" onBlur="if(this.value=='') this.value='Your email:'" onFocus="if(this.value =='Your email:' ) this.value=''">
</div>
</div>
</div>
<div class="span4">
<div class="control-group">
<label class="control-label" for="inputPhone">Phone</label>
<div class="controls">
<input runat="server" class="span4" type="text" id="inputPhone" name="phone" value="Phone number:" onBlur="if(this.value=='') this.value='Phone number:'" onFocus="if(this.value =='Phone number:' ) this.value=''">
</div>
</div>
</div>
</div>
<div class="row">
<div class="span12">
<div class="control-group">
<label class="control-label" for="inputMessage">Message</label>
<div class="controls">
<textarea runat="server" class="span12" id="inputMessage" name="content" onBlur="if(this.value=='') this.value='Message:'"
onFocus="if(this.value =='Message:' ) this.value=''">Message:</textarea>
</div>
</div>
</div>
</div>
<div class="row">
<div class="span12">
<div class="control-group capthca">
<label class="control-label" for="inputCapthca">Checkbox</label>
<div class="controls">
<div class="g-recaptcha" data-sitekey="6Lf8bMQUAAAAAHswc18w7_FunyOQKa9Z0Tkj79YI"></div>
</div>
</div>
</div>
</div>
<asp:Button ID="Send" runat="server" Text="Send" />
</form>
</div>
</div>
</div>
</div>
</div>
<div class="bot1_wrapper">
<div class="container">
<div class="bot1 clearfix">
<div class="row">
<%=cn.GetCopyRight()%>
<%=cn.Getfootermidden()%>
<%=cn.Getfooterright()%>
<%=cn.GetSocial%>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/bootstrap.js"></script>
</div>
</form>
</body>
</html>`
On the code behind page, I want to send an email after clicking the [send] button. This is the code behind.
`enter code here
Protected Sub Send_Click(sender As Object, e As System.EventArgs) Handles Send.Click
If Len(Request("g-recaptcha-response")) > 0 Then
'Mail versturen
Dim objMail As System.Net.Mail.MailMessage = New System.Net.Mail.MailMessage()
Dim objSMTP As System.Net.Mail.SmtpClient = New System.Net.Mail.SmtpClient()
Dim objCred As System.Net.NetworkCredential = New System.Net.NetworkCredential()
Try
objMail.Subject = "Mail"
'objMail.From = New System.Net.Mail.MailAddress("sssa#soemhing.com")
objMail.From = New System.Net.Mail.MailAddress("blabbla#bla.com")
objSMTP.Host = "secret"
objCred.UserName = "secret"
objCred.Password = "secret"
objSMTP.Credentials = objCred
objMail.IsBodyHtml = True
objMail.Body = "Name: " & inputName.Value & "<br>" &
"Email: " & inputEmail.Value & "<br>" &
"Phone: " & inputPhone.Value & "<br><br><br>" &
"Text: " & inputMessage.Value & "<br>"
objMail.To.Add("blabla#gmail.com")
objMail.CC.Add(inputEmail.Value) 'Sender CC
objSMTP.Send(objMail)
Response.Write("<br/><br/>")
Response.Write("<center>")
Response.Write("<h1>Mail sent. You recieve a CC of the message sent. Home</h1>")
Response.Write("</center>")
Catch ex As Exception
Response.Write("<br/><br/>")
Response.Write("<center>")
Response.Write("<h1>Error sending mail. Please, contact us in another way.<h1><br><br>Error: " & ex.Message)
Response.Write("<h1>Email blabla8#gmail.com directly<h1>")
Response.Write("<br><br>Home")
Response.Write("</center>")
End Try
'objMail = Nothing
Else
Response.Write("<h1>You did not check the 'I am not a robot' checkbox.</h1>")
End If
Response.End()
End Sub
End Class
I really dont understand why it says in code behind (when I build)...
inputName, inputEmail, inputPhone and inputMessage are "BC30451 'inputName' is not declared. It may be inaccessible due to its protection level" and I cant not do a textbox.text but I have to do a textbox.value.
Any Ideas? I appreciate already for reading this.
mo3s
Because that's how this markup:
<input type="text" id="greeting" value="hello" runat="server" />
Is mapped in code:
greeting.Value 'hello is the value, greeting is of type System.Web.UI.HtmlControls.HtmlInputText
If you want textbox behaviour, use a textbox:
<asp:TextBox ID="greeting" Text="Hello" runat="server"><asp:/TextBox>
Then your code is:
greeting.Text 'hello
I'm playing around with ejs and want to know how to have some todos appear in the html?
This is what i have to work with:
app.get("/", (req, res) => {
db.collection("todoejs")
.find()
.toArray((err, todoejs) => {
res.render("todo");
});
});
app.post("/create-item", (req, res) => {
console.log(req.body);
db.collection("todoejs").insertOne({todo: req.body.item});
res.redirect("/");
});
I have a todo.ejs in my views folder and would like to know how to get the todos to show.
This is what's in the ejs file:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple To-Do App</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
</head>
<body>
<div class="container">
<h1 class="display-4 text-center py-1">To-Do App</h1>
<div class="jumbotron p-3 shadow-sm">
<form action="create-item" method="POST">
<div class="d-flex align-items-center">
<input name="item" autofocus autocomplete="off" class="form-control mr-3" type="text" style="flex: 1;">
<button class="btn btn-primary">Add New Item</button>
</div>
</form>
</div>
<ul class="list-group pb-5">
<li class="list-group-item list-group-item-action d-flex align-items-center justify-content-between">
<span class="item-text"><%= todoejs %></span>
<div>
<button class="edit-me btn btn-secondary btn-sm mr-1">Edit</button>
<button class="delete-me btn btn-danger btn-sm">Delete</button>
</div>
</li>
</ul>
</div>
</body>
</html>
The second parameter of res.render takes in the variables you want to pass to the template.
In this example, you might want to do res.render("todo", { todoejs: todoejs });
Then todoejs is defined in the template and you can use it however you wish.
I have this nasty display on some elements with bootstrap3
the black triangle is in the MIDDLE of the tooltip.
My placement is set to "auto"
and even removing all my css and all js (keeping only bootstrap and css) I have this problem
// I just keep this to test and still have problem
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
Here is the way it is called (in the footer.php)
(function() {
bootbox.setDefaults({ locale: "en"});
$('[title]').tooltip({
placement:"auto"
});
Here is the FULL Page
<!doctype html>
<html >
<head>
<meta charset="utf-8">
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="btn-group" data-toggle="buttons">
<label title="Main-Stage" class="btn btn-default active" >
<input type="radio" name="options" checked >Main-Stage
</label>
<label title="Chat with DJ" class="btn btn-default" >
<input type="radio" name="options" > DJ
</label>
<label title="Chat with Manager" class="btn btn-default">
<input type="radio" name="options" > Manager
</label>
</div>
<script>
(function() {
$('[title]').tooltip({
placement:"auto"
});
})();
</script>
</body>
</html>
FIDDLE:
http://jsfiddle.net/a279b885/
I am trying to set up a page with a slider control on the homepage. I designed the pages offline and they are working successfully with all the images working as expected but when I uploaded them to my MVC4 page the javascript arrow just keeps spinning and portions of the image are displaying but the ease in out functionality doesn't seem to be working.
Can someone have a look at my code and see if they can see where I am going wrong:
_Layout.cshtml
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!-->
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" id="view" content="width=device-width minimum-scale=1, maximum-scale=1" />
<title>MetaAwareness</title>
<link rel="stylesheet" type="text/css" href= "#Url.Content("~/Content/meta-foundation.min.css")" />
<link rel="stylesheet" type="text/css" href= "#Url.Content("~/Content/meta-style.css")" />
<link rel="stylesheet" type="text/css" href= "#Url.Content("~/Content/meta-color.css")" title="color6" />
<link rel="stylesheet" type="text/css" href= "#Url.Content("~/Content/opensans_stylesheet.css")"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<header>
<div class="content-wrapper">
<div class="container region1wrap">
<div class="row top_header">
<div class="eight columns">
<div class="login">
<i class="icon-signin"></i>Login
</div>
<div class="login user-control"> You are not logged in!</div>
</div>
<div class="four columns">
<div class="row collapse topheader-search">
<div class="eight mobile-three columns">
<input type="text" placeholder="Enter search terms" />
</div>
<div class="four mobile-one columns">
<i class="icon-search"></i>Search
</div>
</div>
</div>
</div>
</div>
<div class="container region2wrap">
<div class="row">
<div class="three columns">
<div id="logo">
<img src= "#Url.Content("~/Images/logo.png")" alt="MetaAwareness" title="MetaAwareness" />
</div>
</div>
<div class="nine columns">
<nav class="top-bar">
<ul>
<li class="name"><h1> Please select your page</h1></li>
<li class="toggle-topbar"></li>
</ul>
<nav>
<ul class="right">
<li><a class="active" href="#Url.Action("Index")"><i class="icon-home"></i>Home</a></li>
<li><i class="icon-laptop"></i>Media</li>
<li><i class="icon-tasks"></i>Courses</li>
<li><i class="icon-user"></i>Profile</li>
<li><i class="icon-comments"></i>Contact</li>
</ul>
</nav>
</nav>
</div>
</div>
</div>
</div>
</header>
<div id="body">
#RenderSection("featured", required: false)
<section class="content-wrapper main-content clear-fix">
#RenderBody()
</section>
</div>
<!--Start of the footer section -->
<footer>
<div class="container region10wrap">
<div class="row footer_bottom">
<div class="six columns">
<p class="copyright">Copyright © 2013 MetaAwareness. All rights reserved.</p>
</div>
<div class="six columns">
<ul class="link-list">
<li>Home</li>
<li>Media</li>
<li>Profile</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
<div id="Login" class="reveal-modal login-modal">
<h2>Login</h2>
<p>Please login using your credentials recived by email when you register.</p>
<form>
<label>Username</label>
<input type="text" placeholder="" />
<label>Password</label>
<input type="text" placeholder="" />
<p class="right">I forgot my password | Resend activation e-mail</p>
<input type="submit" class="medium button" value="Login!" />
</form>
<a class="close-reveal-modal"><i class="icon-remove"></i></a>
</div>
<script type="text/javascript" src= "#Url.Content("~/Scripts/jquery.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/Scripts/foundation.min.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/Scripts/modernizr.foundation.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/plugins/slider-revolution/jquery.themepunch.plugins.min.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/plugins/slider-revolution/jquery.themepunch.revolution.min.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/Scripts/jquery.carouFredSel-6.0.3-packed.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/Scripts/jquery.touchSwipe.min.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/plugins/titan/js/jquery.titanlighbox.js")"></script>
<script type="text/javascript" src= "#Url.Content("~/plugins/titan/js/prettify.js")"></script>
<script type="text/javascript"src= "#Url.Content("~/Scripts/meta-app-head.js")"></script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript"src= "#Url.Content("~/Scripts/meta-app.js")"></script>
</footer>
</body>
Index.cshtml
#{
ViewBag.Title = "Home Page";
}
<div class="container region3wrap">
<div class="mainslider-container responsive">
<div class="mainslider">
<ul>
<li data-transition="slotfade-horizontal" data-slotamount="10" data-thumb= "#Url.Content("~/Images/thumb0.jpg")"> <img src= "#Url.Content("~/Images/thumb0.jpg")"/>
<div class="caption lft"
data-x="80" data-y="0"
data-speed="900"
data-start="900"
data-easing="easeOutExpo"> <img src= "#Url.Content("~/Images/pic_slider_2_1.png")" />
</div>
<div class="caption lfl"
data-x="40"
data-y="13"
data-speed="900"
data-start="1300"
data-easing="easeOutBack"> <img src= "#Url.Content("~/Images/girl.png")" />
</div>
<div class="caption lft big_white"
data-x="505"
data-y="100"
data-speed="400"
data-start="1700"
data-easing="easeOutExpo">High Value, Comprehensive
</div>
<div class="caption lft big_cyan"
data-x="505"
data-y="144"
data-speed="400"
data-start="1900"
data-easing="easeOutExpo">E-learning Solutions
</div>
<div class="caption lft blue"
data-x="505"
data-y="186"
data-speed="400"
data-start="2100"
data-easing="easeOutBack">Inventore veritatis et quasi architecto <br />
beatae dicta sed ut perspiciatis unde omnis<br />
iste natus laudantium.
</div>
</li>
<li data-transition="boxfade" data-slotamount="7" data-thumb= "#Url.Content("~/Images/thumb5.jpg")"> <img src= "#Url.Content("~/Images/thumb5.jpg")" />
<div class="caption sfb"
data-x="0"
data-y="0"
data-speed="900"
data-start="900"
data-easing="easeOutSine"> <img src= "#Url.Content("~/Images/course-banner2.png")" />
</div>
<div class="caption lfb small_white"
data-x="40"
data-y="90"
data-speed="600"
data-start="1800"
data-easing="easeOutExpo">Kickstart Your
</div>
<div class="caption lfb medium_white"
data-x="40"
data-y="130"
data-speed="600"
data-start="2200"
data-easing="easeOutExpo">E-learning Experience
</div>
<div class="caption lfb large_white"
data-x="40"
data-y="185"
data-speed="600"
data-start="2600"
data-easing="easeOutExpo">TODAY...
</div>
</li>
<li data-transition="curtain-3" data-slotamount="7" data-thumb="#Url.Content("~/Images/thumb2.jpg")"> <img src= "#Url.Content("~/Images/thumb2.jpg")" />
<div class="caption lfl"
data-x="35"
data-y="0"
data-speed="900"
data-start="900"
data-easing="easeOutExpo"> <img src= "#Url.Content("~/Images/course-banner4.png")" />
</div>
<div class="caption lfr very_big_white"
data-x="650"
data-y="70"
data-speed="300"
data-start="1400"
data-easing="easeOutExpo">THE QUICKEST
</div>
<div class="caption lfr very_big_white"
data-x="650"
data-y="120"
data-speed="300"
data-start="1600"
data-easing="easeOutExpo">PATH TO
</div>
<div class="caption lfr very_big_white"
data-x="650"
data-y="170"
data-speed="300"
data-start="1800"
data-easing="easeOutExpo">E-LEARNING
</div>
<div class="caption lfb big_white"
data-x="660"
data-y="230"
data-speed="300"
data-start="2000"
data-easing="easeOutExpo">SEE MORE
</div>
</li>
</ul>
<div class="tp-bannertimer"></div>
</div>
</div>
I had forgotten to call the JqueryUI bundle and it was causing problems with IE although working with the rest of the top browsers
I have just started a new project in MVC4 using some code from an existing MVC3 project. I can force my form to ajax reload the specific DIV, but not using the normal submit method, only with the test doSomthing() javascript function. What am I missing?
To clarify: The first button does not work right, the second one does - but I don't want to do it that way.
VIEW
#using (Ajax.BeginForm("Method1", null,
new AjaxOptions { HttpMethod = "post", UpdateTargetId = "divPartial1" },
new { id = "form1" }))
{
<div class="data">
#Html.LabelFor(x => x.TotalSubmitted, new { #class = "total" })<div class="number total">#Html.FormatValue(Model.TotalSubmitted, "{0:n0}")</div>
...
</div>
<div class="details">
<div id="divPartial1">
#Html.Partial("ReportDashboardAppPartial")
</div>
</div>
<div style="text-align: center;">
<button type="submit" class="k-button"><span class="k-icon k-i-search" /></button>
<button type="button" name="Save" value="Save" onclick="doSomething(); return false;"><span class="k-icon k-i-search" /></button>
</div>
}
<script type="text/javascript">
function doSomething() {
$.ajax({
url: '#Url.Action("Method1", "Controller")',
type: 'post',
data: $('form#form1').serialize(),
success: function (result) {
$('#divPartial1').html(result);
}
});
}
</script>
_Layout
#model BaseViewModel
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
#Scripts.Render("~/bundles/modernizr")
#Scripts.Render("~/bundles/jquery")
<link href="#Url.Content("~/Content/kendo.compatibility.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2012.3.1114/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2012.3.1114/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/kendo/2012.3.1114/kendo.default.min.css")" rel="stylesheet" type="text/css" />
#RenderSection("styles", false)
<script src="#Url.Content("~/Scripts/kendo/2012.3.1114/jquery.min.js")"></script>
<script src="#Url.Content("~/Scripts/kendo/2012.3.1114/kendo.all.min.js")"></script>
<script src="#Url.Content("~/Scripts/kendo/2012.3.1114/kendo.aspnetmvc.min.js")"></script>
#RenderSection("scripts", false)
</head>
<body>
#Html.Partial("_AlertWindow")
<div id="wrapper">
<header>
<div id="logindisplay">
#Html.Partial("_LoginPartial")
</div>
<a href="#Url.Action("Index", "Home")">
<div id="logo"></div>
</a>
<div id="title">
<h1>Ha!</h1>
</div>
#(Html.Kendo().Menu().Name("Menu").BindTo("Main").SecurityTrimming(true))
</header>
<div id="main">
#RenderBody()
</div>
<footer>
<div id="version">#Html.ActionLink("Version " + #Model.CurrentVersion, "About", "Home")</div>
</footer>
</div>
#RenderSection("end_scripts", false)
</body>
</html>
I know this should work.
I had the same problem. The solution is to add a statement in _Layout.cshtml page.
#Scripts.Render("~/bundles/jqueryval")
The definition of ScriptBundle("~/bundles/jqueryval") as below
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.unobtrusive*",
"~/Scripts/jquery.validate*"));