I'm using two asp.net ckeckboxes (chk1, and chk2) in a Web Forms project with MasterPage, and I'd like when I click over chk1, the chk2 becomes disable and viceverse without refreshing the entire page, so I'm using updatepanel to achieve this, I just implement the CheckedChanged event on the chk1 and put its AutoPostBack attribute to "true", and everything is ok.
The problem is when I try to implement the bootstrap-switch plugin (the two checkboxes seems like bootstrap-switch perfectly), but the problem is that when I click on the chk1, then the CheckedChanged is not fired, so the enable property of the chk2 is not affected.
I think the problem is when the user clicks on the chk1, in fact the click happens over the span's element's of the bootstrap-switch instead of the chk1 itself.
Please help, sorry for the english.
Update 1:
This is the source code of the page when it is running (right click on the browser), so you can see the bootstrap-switch libraries needed are present:
<html lang="es">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>
- Mi aplicación ASP.NET
</title><script src="/Scripts/modernizr-2.6.2.js"></script>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/Site.css" rel="stylesheet"/>
<link href="/Content/bootstrap-switch/bootstrap3/bootstrap-switch.css" rel="stylesheet"/>
<link href="favicon.ico" rel="shortcut icon" type="image/x-icon" /></head>
<body>
<form method="post" action="./Test" id="ctl01">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__LASTFOCUS" id="__LASTFOCUS" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="h5sbkKDqDt9VeL5xnED+gV4kWiRKNFZBx2sOsl8K60EaOVXCuj7iQZJ3QAjjzsLsrj7CnOY8SUD81Mv51jUBYfWpQL0EHuQO3uPa8Yczm/eLjURJjkDTB57Iw5RJUitxpbKigIF0l4NevEGllIgA8hU3zjrDgSCrPtUA3qs7CJO+/ukopmdmKjOkgTjjWniVywgiMskpJEGPl3fzldVSaqkj8Ikbh+OElJUyureaFxNDS7bLq90ZhlVeNNZxorYyvtaj1HxMgniGxdfx0eClL+RD3ksd+mO6kkzV8mSXx+ykvf+A3Z2gcV0wjAcfpc09oxBF8vvsEtwBbJ+WbDlZLnGqn5W7GAFmmqD2l3e8AAFO6Sh0++Ivr057G/pw+FyebisB2dEOZeb2KZbNxL9/imrP/bBFcKrcyPeGiRUaXtjd7VPTXnD8Vox3T97yjv4P" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['ctl01'];
if (!theForm) {
theForm = document.ctl01;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<script src="/bundles/MsAjaxJs?v=c42ygB2U07n37m_Sfa8ZbLGVu4Rr2gsBo7MvUEnJeZ81" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(Sys) === 'undefined') throw new Error('Error al cargar el marco de trabajo de cliente ASP.NET Ajax.');
//]]>
</script>
<script src="Scripts/jquery-1.10.2.js" type="text/javascript"></script>
<script src="Scripts/bootstrap.js" type="text/javascript"></script>
<script src="Scripts/respond.js" type="text/javascript"></script>
<script src="/bundles/WebFormsJs?v=AAyiAYwMfvmwjNSBfIMrBAqfU5exDukMVhrRuZ-PDU01" type="text/javascript"></script>
<script src="Scripts/bootstrap-switch.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ctl09', 'ctl01', ['tctl00$MainContent$UpdatePanel1','MainContent_UpdatePanel1'], ['ctl00$MainContent$chk1','MainContent_chk1'], [], 90, 'ctl00');
//]]>
</script>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
Nombre de la aplicación
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>Inicio</li>
<li>Acerca de</li>
<li>Contacto</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>Registrarse</li>
<li>Iniciar sesión</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
<div class="col-sm-2">
<input id="MainContent_chk1" type="checkbox" name="ctl00$MainContent$chk1" onclick="javascript:setTimeout('__doPostBack(\'ctl00$MainContent$chk1\',\'\')', 0)" class="BSswitch" data-size="mini" data-on-text="Si" data-off-text="No" /><label for="MainContent_chk1">Check 1</label>
</div>
<div id="MainContent_UpdatePanel1">
<input id="MainContent_chk2" type="checkbox" name="ctl00$MainContent$chk2" /><label for="MainContent_chk2">Check 2</label>
</div>
<hr />
<footer>
<p>© 2016 - Mi aplicación ASP.NET</p>
</footer>
</div>
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="75BBA7D6" />
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="3l2FbHNq3NkXeXDBNuO5RZ4xOmC254tC8PhZRAdihltuEWASclMPM3jqhsB2rrjNHLrlioMYf4cBMhfvlMRCUVMkZXg6Bmvc06rKj2GCmkK97sprq9puXxVbM2rKg+DDwC9aG2lPJIcCLM1viuOkLw==" />
</div></form>
<script>
$("[class='BSswitch']").bootstrapSwitch();
</script>
<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
{"appName":"Internet Explorer","requestId":"41bd03d14e3342bebd4c2f830342b157"}
</script>
<script type="text/javascript" src="http://localhost:30137/825094549df74919a4a0dc141549d775/browserLink" async="async"></script>
<!-- End Browser Link -->
</body>
</html>
And now this is the Test.aspx file:
<%# Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="TestBSswitch.Test" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<div class="col-sm-2">
<asp:CheckBox ID="chk1" AutoPostBack="true" Text="Check 1" OnCheckedChanged="chk1_CheckedChanged" runat="server" />
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:CheckBox ID="chk2" Text="Check 2" runat="server" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="chk1" />
</Triggers>
</asp:UpdatePanel>
</asp:Content>
And now this is the Test.aspx.cs file:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace TestBSswitch
{
public partial class Test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
chk1.InputAttributes.Add("class", "BSswitch");
chk1.InputAttributes.Add("data-size", "mini");
chk1.InputAttributes.Add("data-on-text", "Si");
chk1.InputAttributes.Add("data-off-text", "No");
chk2.InputAttributes.Add("class", "BSswitch");
chk2.InputAttributes.Add("data-size", "mini");
chk2.InputAttributes.Add("data-on-text", "Si");
chk2.InputAttributes.Add("data-off-text", "No");
}
protected void chk1_CheckedChanged(object sender, EventArgs e)
{
if (chk1.Checked)
{
chk2.Enabled = false;
}
else
{
chk2.Enabled = true;
}
}
}
}
In the last file I have posted: "Test.aspx.cs", in the Page_Load event I have to add that attributes manually to the "chk1" in order to obtain the "switch" effect, because if I put that attributes ("data-size", "data-on-text", "data-off-text", and "class") in the aspx editor then it does not work at runtime, and if I delete that lines of code then the CheckedChanged works, but the style of the switch does not work.
Hope I have explain me in more detail, any question please ask me.
I just had to figure out a similar situation. Since bootstrap-switch prevents the CheckedChanged event from firing, I would recommend using jquery and the switchChange event provided by bootstrap-switch instead, like so:
$('#<%= chk1.ClientID%>').on('switchChange.bootstrapSwitch', function (event, state) {
if (state) { //if chk1's switch is set to true
$('#<%= chk2.ClientID%>').bootstrapSwitch('disabled', true);
}
else {
$('#<%= chk2.ClientID%>').bootstrapSwitch('disabled', false);
}
});
Related
I am using bootstrap to make my form. I am unable to use bootstrap datetimepicker in my project. Can master page be a problem?
Please help me out here.
Jquery and Sheets:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" />
<script type="text/javascript">
$(document).ready(function() {
$(function () {
$("#dp").click(function () {
$('#datetimepicker1').datetimepicker();
})
})
});
</script>
ASPX Code:
<div class="col-md-3">
<div class="form-group">
<div class='input-group date' id='datetimepicker2'>
<input type='text' class="form-control" />
<span id="dp" class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
use var date_input = $('#<%=date.ClientID%>'); and set clientmodeid to static.
I have created a small ASP .Net 4.5 application for a client which I have deployed to their server.
When the application is deployed to the client server, the css is not applied to the screens and javascript is not working either.
The clients server is a Windows Server 2008 R2 server and IIS is version 7.
Any help or advice would be greatly appreciated.
Code is listed below:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="utf-8" /><title>
Log in
</title><script src="/UmcDashboard/bundles/modernizr?v=jmdBhqkI3eMaPZJduAyIYBj7MpXrGd2ZqmHAOSNeYcg1"></script>
<link href="/UmcDashboard/Content/css?v=R7tMRBB8EvG-sAq1G9GPLSOfNpsUdVt2BDKTXrBboUg1" rel="stylesheet"/>
<link href="../favicon.ico" rel="shortcut icon" type="image/x-icon" /><meta name="viewport" content="width=device-width" /></head>
<body>
<form method="post" action="Login.aspx?ReturnUrl=%2fUmcDashboard" onsubmit="javascript:return WebForm_OnSubmit();" id="ctl01">
<div class="aspNetHidden">
<input type="hidden" name="ctl08_HiddenField" id="ctl08_HiddenField" value="" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="X/PrXVBXRj648w7TC6ht7amXKGcYUTtuIRfHi+jJnqCNeHPB+RC+5MN7lXWQsYvAGHnZc4GFo0gJgJf6O5F57FPnkx856OjmgrVge+SVcrKAM9Ss1mUmJBTGZf4GeyBIwSpsgcoxntEJDl5+C8h/S69Uz1h3UIRdkJtn0Ut8FEkhxJ09ZksX9a0M/5c/ESCewFwe/BPzeckstskezULt1ME7NYD4uF3OweYsuyuOMTL7qJt/XPz6dTEMETwIhAsMxMkA7y62w6uztsj+v6c03q9ICI7a2ViQ1d3/f/RIMQcyI1X/MpRlpwVP6cdjtCwT" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['ctl01'];
if (!theForm) {
theForm = document.ctl01;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<script src="/UmcDashboard/WebResource.axd?d=pynGkmcFUV13He1Qd6_TZC0itZSQ0gdC6rM1cTDLkhXQkqBs8vcEUYGxjW3G_UlqGyzCShtM_WOfFbVmSDqIwA2&t=634773866700000000" type="text/javascript"></script>
<script src="/UmcDashboard/ScriptResource.axd?d=nv7asgRUU0tRmHNR2D6t1E097zp5q6ASuVO_NvVVES9ARDjdENBrgQSxWwB3uWl4y3kAg1I3muUX35kS0cxi4of4O1yiJ7p9Eb8ue-b_QWQehLHDV-vkZXVEefEhHB_HMuiuC5VZuEied1NgnR23DA2&t=ffffffffdf4c7f25" type="text/javascript"></script>
<script src="/UmcDashboard/ScriptResource.axd?d=x6wALODbMJK5e0eRC_p1Le6JxhuIS2MLNuH3Qlo-s18bUt5DAKao4jMh-P6xYQ6CpcmSKTOw7RDwOdZbolz4CAMqtE6lYH4RL_lyIg_qfBT3kZhHV1dmqwfOIJ_HveLg0&t=7a2ecbb7" type="text/javascript"></script>
<script src="/UmcDashboard/ScriptResource.axd?d=P5lTttoqSeZXoYRLQMIScLO_IGK9f9WiZHHvmSCixGXPkFBZYW9OV3bZYPv8ydKcRpuDkSp2SW3USQ1oCeje17QEcAp6MIqmzxfUxr_NmJZiXcuGo1Wg0axAk3moOAUa0&t=7a2ecbb7" type="text/javascript"></script>
<script src="../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery-ui-1.8.20.min.js" type="text/javascript"></script>
<script src="/UmcDashboard/bundles/WebFormsJs?v=q9E9g87bUDaS624mcBuZsBaM8xn2E5zd-f4FCdIk2cA1" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
if (typeof(ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
//]]>
</script>
<div class="aspNetHidden">
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="v59u+dgHdVImvalqQpn+eUQMJmO43qxrPx50v0ifATzQdHQVd1J+bf71jTw+7sc3igXvXHKDyzt/1swIEszxECv9zb0mkG6/JdKwv8Dj69GtJ4F3v0HW73YLF6uZ0v440Xw5IEAYzgNpD7icMSrYRXITx9xsphq5KlhKtumarKRTMRZp/34mwXiKmDNq+xDR" />
</div>
<script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ctl08', 'ctl01', [], [], [], 90, 'ctl00');
//]]>
</script>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title">
UMC - Intake Arrivals
</p>
</div>
<div class="float-right">
</div>
</div>
</header>
<div id="body">
<section class="content-wrapper main-content clear-fix">
<hgroup class="title">
<h1>Log in.</h1>
</hgroup>
<section id="loginForm">
<p class="validation-summary-errors">
</p>
<fieldset>
<legend>Log in Form</legend>
<ol>
<li>
<label for="MainContent_LogInControl_UserName">User name</label>
<input name="ctl00$MainContent$LogInControl$UserName" type="text" id="MainContent_LogInControl_UserName" />
<span data-val-controltovalidate="MainContent_LogInControl_UserName" data-val-errormessage="The user name field is required." id="MainContent_LogInControl_ctl02" class="field-validation-error" data-val="true" data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid" data-val-initialvalue="" style="visibility:hidden;">The user name field is required.</span>
</li>
<li>
<label for="MainContent_LogInControl_Password">Password</label>
<input name="ctl00$MainContent$LogInControl$Password" type="password" id="MainContent_LogInControl_Password" />
<span data-val-controltovalidate="MainContent_LogInControl_Password" data-val-errormessage="The password field is required." id="MainContent_LogInControl_ctl04" class="field-validation-error" data-val="true" data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid" data-val-initialvalue="" style="visibility:hidden;">The password field is required.</span>
</li>
<li>
<input id="MainContent_LogInControl_RememberMe" type="checkbox" name="ctl00$MainContent$LogInControl$RememberMe" />
<label for="MainContent_LogInControl_RememberMe" class="checkbox">Remember me?</label>
</li>
</ol>
<input type="submit" name="ctl00$MainContent$LogInControl$ctl06" value="Log in" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$MainContent$LogInControl$ctl06", "", true, "", "", false, false))" />
</fieldset>
</section>
</section>
</div>
<footer>
<div class="content-wrapper">
<div class="float-left">
<p>© 2013 - Created by MCS</p>
</div>
</div>
</footer>
<script type="text/javascript">
//<![CDATA[
(function() {var fn = function() {$get("ctl08_HiddenField").value = '';Sys.Application.remove_init(fn);};Sys.Application.add_init(fn);})();//]]>
</script>
</form>
</body>
</html>
Please check the console and resolve the error. I think you have hardcode the CSS and JS Path
It is always good to place the CSS/JS files in a publicly accessible folder. In my case, FormsAuthentication restricted access to such resources.
Change your web.config to make your resource files : CSS , JS publicly accessible. for example::
<location path="~/Resources/Css">
<system.web>
<authorization>
<allow users="*"/>
</authorization>
</system.web>
</location>
One more solution is to check the account used by Anonymous Access. If it is using the IUSR account not the IIS_IUSRS account, add IUSR to the website folder.
I am using kendo ui Mobile ModalView in my aspx page but i am unable to get the required output.On click of button it is showing the same page. I am new to Kendo ui. Please anyone help me.please refer kendo ui mobile modal view and suggest me how to use it in my project.
My code is
<head runat="server">
<title>Untitled Page</title>
<link href="CSS/kendo.common.css" rel="stylesheet" type="text/css" />
<%--<link href="CSS/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />--%>
<link href="CSS/kendo.default.css" rel="stylesheet" type="text/css" />
<link href="CSS/kendo.mobile.all.css" rel="stylesheet" type="text/css" />
<link href="CSS/Example.css" rel="stylesheet" type="text/css" />
<script src="Js/jquery1.7.1.min.js" type="text/javascript"></script>
<script src="CSS/kendo.min.js" type="text/javascript"></script>
<script type="text/javascript">
function closeModalViewLogin() {
$("#modalview-login").data("kendoModalView").open();
}
</script>
<script type="text/javascript">
var app = new kendo.mobile.Application(document.body);
</script>
</head>
<body>
<form id="form1" runat="server">
<div data-role="view" id="modalview-camera" data-title="HTML5 Camera">
<img src="../../content/mobile/modalview/lens.png" class="camera-image" /><br />
<a data-role="button" data-rel="modalview" href="#modalview-login" id="modalview-open-
button">Login</a>
</div>
<div data-role="modalview" id="modalview-login" style="width: 95%; height: 80%;">
<div data-role="header">
<div data-role="navbar">
<span>Login</span>
<a data-click="closeModalViewLogin" data-role="button" data-
align="right">Cancel</a>
</div>
</div>
<ul data-role="listview" data-style="inset">
<li><label for="username">Username:</label> <input type="text" id="username" />
</li>
<li><label for="password">Password:</label> <input type="password" id="password" />
</li>
</ul>
<a data-click="closeModalViewLogin" id="modalview-login-button" type="button" data-
role="button">Login</a>
<a data-click="closeModalViewLogin" id="modalview-reg-button" type="button" data-
role="button">Register</a>
</div>
</form>
</body>
If you look at the example of the code you have used as starting point # http://demos.kendoui.com/mobile/modalview/index.html - you will find out that position of script tags with calls to Kendo framework are located at the bottom of the body tag, if you place them above the body as is shown in your example code, at that stage there is nothing to execute the script on. You need to move them at the correct place. Alternatively use jQuery ready command and call Kendo scripts from there.
$(document).ready(function () {
$("p").text("The DOM is now loaded and can be manipulated.");
});
Additionally, you can initialize the mobile application on the form, instead of the body, since the Views should be direct descendants of the application element.
Change code as per requirements
<html>
<head runat="server">
<title>Model view sample</title>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.mobile.min.js"></script>
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css" rel="stylesheet" />
<script type="text/javascript">
function closeModalViewLogin() {
$("#modalview-login").data("kendoModalView").open();
}
</script>
</head>
<body>
<div data-role="view" id="modalview-camera" data-title="HTML5 Camera">
<a data-role="button" data-rel="modalview" href="#modalview-login" id="modalview-open-button">Login</a>
<div data-role="modalview" id="modalview-login" style="width: 95%; height: 80%;">
<div data-role="header">
<div data-role="navbar">
<span>Login</span>
<a data-click="closeModalViewLogin" data-role="button" data-align="right">Cancel</a>
</div>
</div>
<ul data-role="listview" data-style="inset">
<li>
<label for="username">Username:</label>
<input type="text" id="username" />
</li>
<li>
<label for="password">Password:</label>
<input type="password" id="password" />
</li>
</ul>
<a data-click="closeModalViewLogin" id="modalview-login-button" data-role="button">Login</a>
<a data-click="closeModalViewLogin" id="modalview-reg-button" data-role="button">Register</a>
</div>
</div>
<script type="text/javascript">
var app = new kendo.mobile.Application(document.body);
</script>
</body>
</html>
This works fine.
Note
1: Model view should always use within <div data-role="view" ...>...</div>
2: Intialize kendo mobile application after document to be ready
(i.e var app = new kendo.mobile.Application(document.body))
I'm trying to get an (AJAX (for now without AJAX)) form to submit in a jquery dialogue. But for some reason the tags never get rendered.
Included scripts:
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/jquery-ui-1.8.19.custom.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/jquery-1.7.2.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery-ui-1.8.19.custom.min.js")" type="text/javascript"></script
>
<script src="#Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/MicrosoftMVCAjax.js")" type="text/javascript"></script>
<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>
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/ckeditor/ckeditor.js")" type="text/javascript"></script>
<script src="#Url.Content("~/ckeditor/adapters/jquery.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.inputfocus-0.9.min.js")" type="text/javascript"></script>
<link href="#Url.Content("~/Content/progress.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/multiform.js")" type="text/javascript"></script>
<div id="hidden" style="display:none;">
<div id="coinDialogue" title="New Coin">
#using(Html.BeginForm("CreateCoin", "Home"))
{
#Html.ValidationSummary(true)
<div style="display: inline;">
<label for="FaceValue">
Coin value</label>
<input type="text" name="FaceValue" id="FaceValue" value="" style="width: 35px;" />
<select id="currency_type" name="currency_type">
<option value="USD" selected="selected">USD</option>
<option value="EUR">EUR</option>
</select>
</div>
<br />
<label for="ReusePeriod">
Usage:</label>
<select id="ReusePeriod" name="ReusePeriod">
<!-- Loop with for and values from Model (gotten from Paycento API) -->
<option value="o" selected="selected">Once</option>
<option value="w" >Weekly</option>
</select>
<br />
<label for="ValidFrom">
Validate from</label>
<br />
<input type="text" id="ValidFrom" name="ValidFrom" value="" />
<br />
<label for="ValidUntil">
Validate To</label>
<input type="text" id="ValidUntil" name="ValidUntil" value="" />
<br />
<input type="submit" value="Create new coin" />
}
</div>
<script type="text/javascript">
$('#coinDiaLink').click(function () {
$('#coinDialogue').dialog({
buttons: {
Cancel: function () {
$(this).dialog('close');
},
Create: function () {
$('#createCoinForm').trigger('submit');
}
}
});
});
</script>
</div>
Can you please replace Ajax.Beginform with Html.BeginForm & see whether it posts the entire page, if it does then one of the problem could be -- Ajax.Beginforms requires some scripts files to be included in either view or masterview, see if those are missing
jquery.unobtrusive-ajax.min.js
MicrosoftAjax.js
MicrosoftMvcAjax.js
I just implemented my website with a Master Page. so it loads the same header and same footer
for every page,
and now my forms doesn't work anymore.
tried to move the <form> tag inside the master page and outside and still nothing.
Master Page:
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="WebSite.master.cs" Inherits="WebSite.WebSite" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title><asp:ContentPlaceHolder ID="titleContent" runat="server" /></title>
<link href="Resources/css/styles.css" rel="stylesheet" type="text/css" />
<link href="Resources/css/jqModal.css" rel="stylesheet" type="text/css" />
<link href="Resources/css/boxy.css" rel="stylesheet" type="text/css" />
<link href="Resources/css/form.css" rel="stylesheet" type="text/css" />
<script src="Resources/js/swfobject.js" type="text/javascript" > </script>
<script src="Resources/js/jquery-1.3.2.min.js" type="text/javascript" > </script>
<script src="Resources/js/jqModal.js" type="text/javascript"> </script>
<script src="Resources/js/soundmanager.js" type="text/javascript" > </script>
<script src="Resources/js/JScriptFunctions.js" type="text/javascript" > </script>
<script src="Resources/js/jquery.boxy.js" type="text/javascript" ></script>
<script src="Resources/js/styled.js" type="text/javascript" ></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form name="aspnetForm" method="post" id="aspnetForm" runat="server">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<div id="wrapper">
<div id="animation">
<div id="ctl00_singleBannerHomePage_pnlFlashContent">
</div>
<script language="javascript" type="text/javascript">
generateBanner(980, 220, 'ctl00_singleBannerHomePage_pnlFlashContent', 'bannersingleBannerHomePage', 'http://www.WebSite.com//Resources//flash/topmenu.swf', '');
</script>
</div>
<div class="banner" style="text-align: center;">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="960" height="120"
id="logo_250x105" align="middle">
<param name="movie" value="Resources/flash/banner_960x120.swf">
<param name="quality" value="high">
<param name="play" value="true">
<param name="loop" value="true">
<param name="wmode" value="transparent">
<param name="scale" value="showall">
<param name="menu" value="true">
<param name="devicefont" value="false">
<param name="salign" value="">
<param name="allowScriptAccess" value="sameDomain">
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="Resources/flash/banner_960x120.swf"
width="960" height="120">
<param name="movie" value="/resources/flash/banner_960x120.swf">
<param name="quality" value="high">
<param name="play" value="true">
<param name="loop" value="true">
<param name="wmode" value="transparent">
<param name="scale" value="showall">
<param name="menu" value="true">
<param name="devicefont" value="false">
<param name="salign" value="">
<param name="allowScriptAccess" value="sameDomain">
<!--<![endif]-->
<a href="https://www.adobe.com/go/getflash">
<img src="Resources/get_flash_player.gif" alt="Get Adobe Flash player">
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
<asp:ContentPlaceHolder ID="Main" runat="server">
</asp:ContentPlaceHolder>
<div id="footer">
<div id="menu_footer">
<ul>
<li><a id="ctl01_lnkMenuOption" href="http://www.WebSite.com/">
Home</a></li>
<li class="separator">|</li>
<li><a id="ctl03_lnkMenuOption" href="http://www.WebSite.com/">
Login</a></li>
<li class="separator">|</li>
<li><a id="ctl05_lnkMenuOption" href="http://www.WebSite.com/register">
Free Register</a></li>
<li class="separator">|</li>
<li><a id="ctl07_lnkMenuOption" href="http://www.WebSite.com/how">
How Does it work</a></li>
<li class="separator">|</li>
<li><a id="ctl15_lnkMenuOption" href="http://www.WebSite.com/winners">
Winners List</a></li>
<li class="separator">|</li>
<li><a id="ctl17_lnkMenuOption" href="http://www.WebSite.com/myAccount">
Members</a></li>
<li class="separator">|</li>
<li><a id="ctl19_lnkMenuOption" href="http://www.WebSite.com/">
Site Map</a></li>
<li class="separator">|</li>
<li><a id="ctl21_lnkMenuOption" href="http://www.WebSite.com/contact">
Contact</a></li>
<li class="separator">|</li>
<li><a id="ctl23_lnkMenuOption" href="http://www.WebSite.com/terms">
Terms & Policy</a></li>
<li class="separator">|</li>
<li><a id="ctl25_lnkMenuOption" href="http://www.WebSite.com/about">
About</a></li>
</ul>
<ul>
<li>Beta</li>
<li class="separator">|</li>
<li>Beta</li>
<li class="separator">|</li>
<li>Beta</li>
<li class="separator">|</li>
<li>Beta</li>
<li class="separator">|</li>
<li>Beta</li>
<li class="separator">|</li>
<li>Beta</li>
<li class="separator">|</li>
<li>
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" addthis:url="http://www.facebook.com/pages/WebSite/187442987973985" ></a>
<a class="addthis_button_tweet" addthis:url="http://www.WebSite.com/" ></a>
<a class="addthis_counter addthis_pill_style" addthis:url="http://www.WebSite.com/" ></a>
</div>
<script type="text/javascript"> var addthis_config = { "data_track_clickback": true };</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=danpe"></script>
<!-- AddThis Button END -->
</li>
<li class="separator">|</li>
<li>WebSite © 2011</li>
</ul>
</div>
</div>
<object type="application/x-shockwave-flash" id="flashAlert" name="flashAlert" data="Resources/flash/AlertPlayer.swf"
width="1" height="1">
</object>
</form>
<script type="text/javascript">
$(document).ready(function () {
$('#adscaptcha_facebook_like_holder').remove();
$('#adscaptcha_buttons_holder').remove();
$('#adscaptcha_r4').remove();
});
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-23547527-1']);
_gaq.push(['_setDomainName', '.WebSite.com']);
_gaq.push(['_trackPageview']);
(function () {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
default.aspx
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="Default" MasterPageFile="~/WebSite.Master" Title="" %>
<asp:Content ID="ContentTitle" ContentPlaceHolderID="titleContent" Runat="Server">
WebSite!
</asp:Content>
<asp:Content ID="ContentHead" ContentPlaceHolderID="head" Runat="Server">
<meta name="AUTHOR" content="WebSite.com">
<meta name="CLASSIFACTION" content="auction, auctions">
<meta name="RATING" content="GENERAL">
<meta name="DISTRIBUTION" content="GLOBAL">
<meta name="REVISIT" content="1 DAYS">
<meta name="ROBOTS" content="INDEX,FOLLOW">
<meta property="og:title" content="WebSite! - SecondLife Auctions" />
<meta property="og:site_name" content="WebSite" />
<meta property="og:image" content="hhttp://www.WebSite.com/Resources/images/logo.png" />
<meta property="og:url" content="http://www.WebSite.com/" />
<meta property="fb:admins" content="1277633739" />
<link rel="image_src" href="http://www.WebSite.com/Resources/images/logo.png" />
<link rel="SHORTCUT ICON" href="http://www.WebSite.com/WebSite.ico" />
<script type="text/javascript">
function alertMe(message) {
var options = $.extend({ title: "Information" }, options || {});
var dialog = new Boxy("<div><p>" + message + "<a href='#' onclick='Boxy.get(this).hide(); return false'>Close me!</a></p></div>", options);
allDialogs.push(dialog);
return false;
}
</script>
<script type="text/javascript">
var message = "Impossible Action";
function clickIE() { if (document.all) { return false; } }
function clickNS(e) {
if
(document.layers || (document.getElementById && !document.all)) {
if (e.which == 2 || e.which == 3) { return false; }
}
}
if (document.layers)
{ document.captureEvents(Event.MOUSEDOWN); document.onmousedown = clickNS; }
else { document.onmouseup = clickNS; document.oncontextmenu = clickIE; }
document.oncontextmenu = new Function("return false")
</script>
<style type="text/css" media="screen">
#ctl00_singleBannerHomePage_pnlFlashContent
{
visibility: hidden;
}
</style>
</asp:Content>
<asp:Content ID="ContentMain" ContentPlaceHolderID="Main" Runat="Server" >
<div id="content">
<div class="sign-in-home">
<div class="login-form-home">
<% Response.Write(LoginPanel()); %>
<input type="submit" name="cmdLogin" value="Login" id="cmdLogin" class="red-button" tabindex="3" runat="server" />
</div>
</div>
<div class="login-text-home"></div>
</div>
<div class="sort-by-home">
<% Response.Write(SortPanel()); %>
</div>
<% Response.Write(Auctions()); %>
<script type="text/javascript">
$(document).ready(function () {
startAuctionsServiceHomePage();
});
</script>
</asp:content>
default.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
Response.Write("Page_Load");
if (Request.Form["cmdLogin"] != null && Request.Form["cmdLogin"] != "")
{
Response.Write("cmdLogin");
}
}
The problem is that the Respone.Write("cmdLogin"); doesn't show up, and it used to show up before i had the Master Page.
Even when you are using a master page, you still only get one markup coming out of it. So look at it this way:
Master Page:
<html>
<head>
</head>
<body>
<form method='POST' action='index.aspx'>
<placeholder>
</form>
</body>
</html>
WebForm:
<content>
<input type='text' value='hello' />
<input type='submit' value='Submit' />
</content>
output Markup
<html>
<head>
</head>
<body>
<form method='POST' action='index.aspx'>
<input type='text' value='hello' />
<input type='submit' value='Submit' />
</form>
</body>
</html>
The point is that if you use a form in both, you can expect to have nested forms appear on the final markup if you have forms in both. This is just an outline of what it can look like. If you post your pages we can give you more appropriate assistance.
Edit
Take advantage of the OOP available in C# - Create a Button object and append it to the page. You will always have a reference to it that way. Avoid writing to the response in asp.Net
#Danpe - have you taken a look at the page source that is rendered before you click the cmdLogin button? Have you placed a break point in the page_load to see what the value of Request.Form["cmdLogin"] is?
Unless you are using Framework 4 and static control ID mechanism, the ID/name of the cmdLogin button will not actually be "cmdLogin", but rather a modified name to ensure that ID does not conflict with other controls in the page. This has been standard behavior of ASP.Net since its inception, I believe.
Since cmdLogin is a server-side control, you would actually be better served by adding a button click event handler in the codebehind, rather than trying to manually parse the form parameters. You seem to be fighting with the features that Web Forms provides.
Change this:
<input type="submit" name="cmdLogin" value="Login" id="cmdLogin" class="red-button" tabindex="3" runat="server" />
to this:
<asp:Button id="cmdLogin" Text="Login" CSSClass="red-button" tabindex="3" runat="server" />
and then in the .cs file you can access the button by:
cmdLogin.Text = "newText";
Edit
add this to the asp:Button tag
OnClick="ClickedFunction"
OR
add this to the .cs file:
protected override void onInit(EventArgs e)
{
cmdLogin.Click += new EventHandler(cmdLogin_click);
}
void cmdLogin_click(object sender, EventArgs e)
{
//Code for click here
}
Move your form declaration to the master page, something like:
<body>
<form id="form1" runat="server">
Try removing this block from the master page:
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>