Can someone help me please?
I would like to pass the input values of the two textboxes to the controller of the view.
<%# Page Title="" Language="C#" MasterPageFile="~/Views/Shared/personenbeheer.master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<UDL.Domain.Persoon>>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="PersonenbeheerContent" runat="server">
<legend class="form-signin-heading">Personenlijst</legend>
<% Html.BeginForm("Index", "Persoon", FormMethod.Get);%>
<% var currentUser = HttpContext.Current.User; %>
<% if (currentUser.IsInRole("Beheerder"))
{ %>
<nav>
<ul class="nav nav-pills nav-justified" role="tablist">
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;"><%: Html.ActionLink("Maak persoon aan", "Create", null, new { #class="UDLbutton" })%></li>
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;"><%: Html.ActionLink("Lijst Pdf", "PrintPersonen", new { sort = ViewData["sort"], zoeknaam = ViewData["zoekNaam"]}, new { target = "_blank",#class="UDLbutton"}) %></li>
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;">
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#etiketten"> Adres etiketten</button></li>
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;"><%: Html.ActionLink("Export emailadressen","ExportEmails", new { sort = "Adres", zoeknaam = ViewData["zoekNaam"]}, new { target = "_blank",#class="UDLbutton"}) %></li>
</ul>
</nav>
<% } %>
<% Html.BeginForm("Index", "Persoon", FormMethod.Post);
{ %>
<input type="text" id="txtA"/>
<input type="text" id="txtB"/>
<input type="submit" value="Verzenden"/>
<% } %>
As you can see I use twice Html.BeginForm for the same method but once for a GET and once for a POST. But the POST isn't working :(
This is the controller:
//
// GET: /Persoon/
[Authorize(Roles = "Gebruiker, Beheerder")]
public ActionResult Index(string sortOrder, string zoekNaam, int? page, string huidigefilter)
{
//huidige zoekfilter
ViewBag.huidigzoeken = sortOrder;
//ViewBags om waarden door te geven naar de View en ze geven data over het sorteren door
ViewBag.PersoonIDSortParm = String.IsNullOrEmpty(sortOrder) ? "PersoonID_desc" : "";
ViewBag.NaamSortParm = sortOrder == "Naam" ? "Naam_desc" : "Naam";
ViewBag.AanhefSortParm = sortOrder == "Aanhef" ? "Aanhef_desc" : "Aanhef";
ViewBag.GemeenteSortParm = sortOrder == "Gemeente" ? "Gemeente_desc" : "Gemeente";
ViewBag.GeslachtSortParm = sortOrder == "Geslacht" ? "Geslacht_desc" : "Geslacht";
ViewBag.AdresSortParm = sortOrder == "Adres" ? "Adres_desc" : "Adres";
ViewBag.VoornaamSortParm = sortOrder == "Voornaam" ? "Voornaam_desc" : "Voornaam";
ViewBag.TelefoonSortParm = sortOrder == "Telefoon" ? "Telefoon_desc" : "Telefoon";
ViewBag.GSMSortParm = sortOrder == "GSM" ? "GSM_desc" : "GSM";
ViewBag.EmailSortParm = sortOrder == "Email" ? "Email_desc" : "Email";
ViewBag.PartnerSortParm = sortOrder == "Partner" ? "Partner_desc" : "Partner";
ViewBag.OpmerkingenSortParm = sortOrder == "Opmerkingen" ? "Opmerkingen_desc" : "Opmerkingen";
//ViewBag.StatusLidSortParm = sortOrder == "StatusLid" ? "StatusLid_desc" : "StatusLid";
ViewBag.huidigefilter = zoekNaam;
ViewData["sort"] = sortOrder;
ViewData["zoekNaam"] = zoekNaam;
//Enkel de personen tonen die geen lid zijn
var personen = PersoonBLL.SorteerZoeken(sortOrder, zoekNaam, page, huidigefilter);
ViewData["PersonenCount"] = PersoonBLL.SorteerZoekenNotPaged(sortOrder, zoekNaam).ToList().Count;
return View(personen);
}
[HttpPost]
public ActionResult Index(String a, String b)
{
return View("Index");
}
I use a breakpoint for the HttpPost method but it's never going in.
You need to set the name attribute of each input element to match the parameter name in the controller method.
So you should have in your view:
<input type="text" id="txtA" name="txtA" />
<input type="text" id="txtB" name="txtB" />
And in your controller:
public ActionResult Index(String txtA, String txtB)
When you want two forms inside your page you have to end the form by doing:
<%Html.EndForm(); %>
So now my code looks like this:
<%# Page Title="" Language="C#" MasterPageFile="~/Views/Shared/personenbeheer.master" Inherits="System.Web.Mvc.ViewPage<IEnumerable<UDL.Domain.Persoon>>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="PersonenbeheerContent" runat="server">
<legend class="form-signin-heading">Personenlijst</legend>
<% Html.BeginForm("Index", "Persoon", FormMethod.Get);%>
<% var currentUser = HttpContext.Current.User; %>
<% if (currentUser.IsInRole("Beheerder"))
{ %>
<nav>
<ul class="nav nav-pills nav-justified" role="tablist">
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;"><%: Html.ActionLink("Maak persoon aan", "Create", null, new { #class="UDLbutton" })%></li>
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;"><%: Html.ActionLink("Lijst Pdf", "PrintPersonen", new { sort = ViewData["sort"], zoeknaam = ViewData["zoekNaam"]}, new { target = "_blank",#class="UDLbutton"}) %></li>
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;">
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#etiketten"> Adres etiketten</button></li>
<li role="presentation" class="alert-info" style="border: 2px solid white; border-radius: 5px;"><%: Html.ActionLink("Export emailadressen","ExportEmails", new { sort = "Adres", zoeknaam = ViewData["zoekNaam"]}, new { target = "_blank",#class="UDLbutton"}) %></li>
</ul>
</nav>
<% } %>
<%Html.EndForm(); %>
<% Html.BeginForm("Index", "Persoon", FormMethod.Post);
{ %>
<input type="text" id="txtA" name="txtA"/>
<input type="text" id="txtB" name="txtB"/>
<input type="submit" value="Verzenden"/>
<% } %>
<%Html.EndForm(); %>
Related
can you tell me whats bad? I need only check on button select language to continue on next website.
HTML
<asp:Content ID="BodyContent" ContentPlaceHolderID="BodySite" runat="server">
<h1>Výběr jazyka:</h1>
<p>Choose language | Sprachauswahl</p>
<form method="post" action="index.aspx">
<div class="checkbox-test">
<table style="border-spacing: 5px; border-collapse: separate;">
<tr>
<td>
<input type="radio" name="check_lang" id="check_cz" class="css-checkbox" value="cz" />
<label for="check_cz" class="css-label"><img src="http://terquil.cz/images/cz.png" class="img-flag" alt="CZ" /></label>
</td>
<td><h2>CZ</h2></td>
</tr>
<tr>
<td>
<input type="radio" name="check_lang" id="check_en" class="css-checkbox" value="en" />
<label for="check_en" class="css-label"><img src="http://terquil.cz/images/uk.png" class="img-flag" alt="EN" /></label>
</td>
<td><h2>EN</h2></td>
</tr>
<tr>
<td>
<input type="radio" name="check_lang" id="check_de" class="css-checkbox" value="de" />
<label for="check_de" class="css-label"><img src="http://terquil.cz/images/de.png" class="img-flag" alt="DE" /></label>
</td>
<td><h2>DE</h2></td>
</tr>
</table>
</div>
<input Type="submit" id="language_btn" VALUE="Pokračovat | Continue | Andere" >
</form>
C# (i tried this but dont work)
protected void submit(object sender, EventArgs e)
{
string cz = "cz";
string de = "de";
string en = "en";
if (Request.Form["check_lang"] != null)
{
string selectLanguage = Request.Form["check_lang"].ToString();
if (selectLanguage == cz)
Response.Redirect("http://terquil.cz/cs/index.aspx");
if (selectLanguage == en)
Response.Redirect("http://terquil.cz/en/index.aspx");
if (selectLanguage == de)
Response.Redirect("http://terquil.cz/cs/index.aspx");
}
}
CSS group objects:
input[type=radio].css-checkbox {
position:absolute;
z-index:-1000;
left:-1000px;
overflow: hidden;
clip: rect(0 0 0 0);
height:1px;
width:1px;
margin:-1px;
padding:0;
border:0;
}
input[type=radio].css-checkbox + label.css-label {
padding-left:37px;
height:32px;
display:inline-block;
line-height:32px;
background-repeat:no-repeat;
background-position: 0 0;
font-size:32px;
vertical-align:middle;
cursor:pointer;
}
input[type=radio].css-checkbox:checked + label.css-label {
background-position: 0 -32px;
}
label.css-label {
background-image:url(http://csscheckbox.com/checkboxes/u/csscheckbox_c1a4f40d98f1c23d1ad84d2af9c314be.png);
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}
I need make only that if someone select radio for his specify language and click on submit button so he will redirect to specify html page for his language.
Either use runat="server" to access it in c# code
Or use javascript, on change event of radio button you can store value in a hidden field which will be accessible into your c# code.
$(document).ready(function(){
$('#rdbEnglish').click(function(){
$('#hdn').val('English');
});
I am using the following to code to bind a dropdownlist using jquery
if ($("#status_input option[value='" + status + "']").length > 0) {
$('#status_input').val(status);
}
else {
$('#status_input').get(0).selectedIndex = -1;
}
in status i am getting "1", i am not getting any error, but not able to bind the dropdownliast as well as this stops the working code, means when i am commenting this code the reset information bind successfully but, when i am using this code, it does not throw any error as well as not binding the Results.
Please help me how can resolve this.
UPDATE::'
My HTML is::
<asp:Repeater ID="OffersRepeater" runat="server">
<ItemTemplate>
<div class="grid_row">
<div class="offer_id" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "OfferId") %>
</div>
<div class="offer_active" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "ActiveStatus")%>
</div>
<div class="offer_partner" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Partner") %>
</div>
<div class="offer_description" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Description") %>
</div>
<div class="offer_image" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "ImageSource") %>
</div>
<div class="offer_url" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Url") %>
</div>
<div class="offer_url_text" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "UrlText") %>
</div>
<div class="offer_email" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Email") %>
</div>
<div class="offer_phone" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Phone") %>
</div>
<div class="offer_status" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "IsActive").ToString().ToLower()=="true" ? "1" : "0" %>
</div>
<div class="offer_approval_date" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "ApprovalDate") is DateTime ? ((DateTime)DataBinder.Eval(Container.DataItem, "ApprovalDate")).ToString( "MM-dd-yyyy") : "" %>
</div>
<div class="offer_start_date" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "StartDate") is DateTime ? ((DateTime)DataBinder.Eval(Container.DataItem, "StartDate")).ToString( "MM-dd-yyyy") : ""%>
</div>
<div class="offer_end_date" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "EndDate") is DateTime ? ((DateTime)DataBinder.Eval(Container.DataItem, "EndDate")).ToString( "MM-dd-yyyy") : ""%>
</div>
<div class="offer_legal" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "LegalInformation") %>
</div>
<div class="offer_twitter" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Twitter") %>
</div>
<div class="offer_facebook" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Facebook")%>
</div>
<div class="offer_legalonofferpage" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "LegalOnOfferPage")%>
</div>
<div class="offer_Season" style="display: none;">
<%# DataBinder.Eval(Container.DataItem, "Season")%>
</div>
<div class="grid_row_background" runat="server" id="RowBackground">
</div>
<div class="grid_row_foreground">
<div class="grid_cell" style="padding-left: 10px; width: 420px;">
<span class='<%# DataBinder.Eval(Container.DataItem, "ActiveStatus")%>'></span>
<%# DataBinder.Eval(Container.DataItem, "Partner") %>
</div>
<div class="grid_cell">
<a href="javascript:void(0)" onclick="ViewXmlOffer(this);" title="View Offer" class="icon_button view_icon">
</a>
<a href="javascript:void(0)" onclick="editOffer(this);" title="Edit Offer" class="icon_button edit_icon">
</a>
</div>
<div class="clear">
</div>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
here is that DRPDOWN
<div class="box_foreground">
<div class="form_field_text" title="OFFER STATUS" style="width: 298px;">
OFFER STATUS</div>
<select id="status_input" class="form_input" style="width: 308px;">
<option value="1" selected="selected">ACTIVE</option>
<option value="0">DEACTIVATED</option>
</select>
</div>
MY JQUERY CODE IS ::
function editOffer(link) {
$('#offerEntryBox').data('offer', $(link).parents('.grid_row'));
$('#offerEntryBox').data('category', $(link).parents('.grid').parent());
alert('hi');
resetForm();
$('#offerListBox').fadeOut('fast', function () {
$('#offerEntryBox').fadeIn('fast'); doResize();
});
}
and the function in which i am facing problem is :: resetForm();
function resetForm() {
var partner = '', categoryID = '', url = '', urlText = '', email = '', phone = '', startDate = '', endDate = '', description = '', legal = '', image = '', twitter = '', facebook = '', status = '1', Season='';
var myOfferEditor = $find(offereditorname);
var myLegalEditor = $find(legaleditorname);
$('#Legendbox').css('display', 'none');
var offer = $('#offerEntryBox').data('offer');
if (offer != null && offer != undefined) {
$('#offerEntryBox').find('.form_title').text('EDIT OFFER');
partner = $(offer).children('.offer_partner').text();
url = $(offer).children('.offer_url').text();
urlText = $(offer).children('.offer_url_text').text();
email = $(offer).children('.offer_email').text();
phone = $(offer).children('.offer_phone').text();
startDate = $(offer).children('.offer_start_date').text();
endDate = $(offer).children('.offer_end_date').text();
description = $(offer).children('.offer_description').html();
legal = $(offer).children('.offer_legal').html();
image = $(offer).children('.offer_image').text();
status = $(offer).children('.offer_status').text();
twitter = $(offer).children('.offer_twitter').text();
facebook = $(offer).children('.offer_facebook').text();
Season = $(offer).children('.offer_Season').text();
}
else
$('#offerEntryBox').find('.form_title').text('NEW OFFER');
var category = $('#offerEntryBox').data('category');
if (category != null && category != undefined)
categoryID = $(category).children('.category_id').text();
$('#partner_input').val(partner);
$('#url_input').val(url);
$('#url_text_input').val(urlText);
$('#partner_email_input').val(email);
$('#phone_input').val(phone);
myOfferEditor.set_html(description);
myLegalEditor.set_html(legal);
$('#twitter_input').val(twitter);
$('#facebook_input').val(facebook);
alert(status);
// if ($('[id$=category_input option[value=22]').length > 0) {
// alert(categoryID);
// }
// if ($("#category_input option[value='" + categoryID + "']").length > 0) {
// $('#category_input').val(categoryID);
// alert('entered 1');
// }
// else {
// $('#category_input').get(0).selectedIndex = -1;
// alert('entered 2');
// }
if ($("#status_input option[value='" + status + "']").length > 0) {
$('#status_input').val(status);
}
else {
$('#status_input').get(0).selectedIndex = -1;
}
$('#start_date_input').val(startDate);
$('#end_date_input').val(endDate);
validateDate($('#start_date_input'));
validateDate($('#end_date_input'));
$('.form_input', '#submit_offer_form').not('select, #start_date_input, #end_date_input').each(function () {
$(this).siblings('.form_field_text').text($.trim(this.value) == '' ? $(this).siblings('.form_field_text').attr('title') : this.value);
});
$('select.form_input', '#submit_offer_form').each(function () {
$(this).css('display', 'none');
$(this).siblings('.form_field_text').text($.trim(this.value) == '' ? $(this).siblings('.form_field_text').attr('title') : $(this).children('option:selected').text())
});
$('#image_preview_container').children('img').remove();
if (image != '' && contentPath != undefined) {
$('#image_source_input').val(image);
loadPreview(contentPath, image, $('#image_preview_container'), 195, 98);
}
setBoxHighlight($('.form_field', '#submit_offer_form').add($('#image_source_input').parents('.form_part')), false);
$('.form_status_message').text('');
setFormInteraction(true);
}
I have resolved out the issue actually the value is containing the white space. that's why it didn't get the exact value. i have just trim the string value to resolve the issue.
We have an issue, when the session timeout occurs - it logsoff the user and then presents the login screen. The issue is we have a page header which has tabs for user to hit. But we also present most common tab grid automatically. The page header stays. So after the timeout, that page header is there and new page header displays so there are 2 of them.
way out is to x out and relogin. But there must be some way to clear the entire page when there is timeout, this is my header page
<
%# Page Language="C#" AutoEventWireup="true" CodeBehind="Interchange.aspx.cs" Inherits="FDB.Views.Interchange" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script lang="jv" type="text/javascript">
function SetHiddenValue(fieldName, val) {
if (hfCommon.Contains(fieldName))
hfCommon.Set(fieldName, val);
else
hfCommon.Add(fieldName, val);
}
function GetHiddenValue(fieldName) {
if (hfCommon.Contains(fieldName))
return hfCommon.Get(fieldName);
else
return null;
}
function ImageClick(s, e) {
var val = GetHiddenValue('ShowHideFilter');
if (val == null)
SetHiddenValue('ShowHideFilter', true);
else {
SetHiddenValue('ShowHideFilter', !val);
}
val = GetHiddenValue('ShowHideFilter')
gvPBMCharges.PerformCallback('ShowHideFilter,' + val.toString());
}
function TreeCheckedChanged(s, e) {
gvPBMCharges.PerformCallback(e.node.name + '');
}
function ColExpClickFacility() {
//debugger;
var divM = document.getElementById('ASPxRoundPanel1_div3');
if (divM != undefined && divM != null) {
if (divM.style.display == 'block') {
divM.style.display = 'none';
hlColExpFacility.SetText('Expand Facility');
}
else {
divM.style.display = 'block';
hlColExpFacility.SetText('Collapse Facility');
}
}
}
function ColExpClick() {
var divM = document.getElementById('div1');
var divTop = document.getElementById('divTop');
if (divM != undefined && divM != null) {
if (divM.style.display == 'block') {
divM.style.display = 'none';
//s.SetImageUrl('../Content/Images/expand.png');
hlColExp.SetText('Expand Instructions');
divTop.style.height = '45px';
}
else {
divM.style.display = 'block';
//s.SetImageUrl('../Content/Images/collapse.png');
hlColExp.SetText('Collapse Instructions');
divTop.style.height = '165px';
}
}
}
function CheckedChangedSelectAll(s, e) {
if (s.GetChecked()) {
cblFacility.SelectAll();
}
else {
cblFacility.UnselectAll();
}
gvPBMCharges.PerformCallback('');
}
function SelectedIndexChangedFacility(s, e) {
gvPBMCharges.PerformCallback('');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div runat="server" id="divTop">
<div runat="server" id="divTitle" style="float: left; width: 50%;">
</div>
<div runat="server" id="divFilter" style="float: right; text-align: right; width: 49.84%; height: 34px; padding-top: 10px;">
<table border="0" style="width: 100%;">
<tr>
<td style="padding-left: 3px; padding-top: 3px; text-align: right;">
<div runat="server" id="div2" style="width: 100%; padding-bottom: 5px;">
<dx:ASPxHyperLink runat="server" ID="hlColExp" Font-Underline="true" ClientInstanceName="hlColExp" Text="Expand Instructions" NavigateUrl="javascript:ColExpClick();">
</dx:ASPxHyperLink>
</div>
</td>
<td style="padding-left: 3px; text-align: right; width: 90px;">Select Patient:
</td>
<td style="padding-left: 3px; text-align: right; width: 215px;">
<dx:ASPxComboBox runat="server" ID="cboPatient" ValueField="Id" TextField="Name" NullText="Select patient from drop down" Width="200">
<ClientSideEvents SelectedIndexChanged="function(s,e){ gvPBMCharges.PerformCallback(''); }" />
</dx:ASPxComboBox>
</td>
</tr>
</table>
</div>
I am try to implement drag and drop of items into an MVC application, where I drag from div to another div - this div will call a post event, passing in the data-id.
I am relatively new to jQuery coding, so I may be missing something very stupid...
Code
<div id="column1" style="width: 400px; background-color: rgba(255, 0, 0, 1)">
<ul style="list-style-type: none;">
<li data-id="1">
<a href="#">
<img src="http://placehold.it/200x200" />
</a>
</li>
</ul>
</div>
<div id="column2" style="width: 400px; background-color: black">
<ul>
<li>
<a href="#">
<img src="http://placehold.it/200x200" />
</a>
</li>
</ul>
</div>
<script>
$("#column li").draggable({
revert: true,
drag: function () {
$(this).addClass("active");
var a = $(this).closest("#column").addClass("active");
},
stop: function () {
$(this).removeClass("active").closest("#column1").removeClass("active");
}
});
</script>
The above works fine, it does drag - however my issue is with dropping. Anything that has an ID that contains Column should accept drops, I tried to replicate the above for drop, but I do not even get the alert...
$("#column").droppable({
tolerance: "touch",
drop: function (event, ui) {
alert('Hello World');
var targetColumn = $(this),
move = ui.draggable,
itemId = move.attr("data-id");
$.post("Controller/Action", { id: itemId, obj: move });
}
});
Any advice?
Thanks.
Your code probably is not working well, because your selector not match any element (you have no element with id #column).
You probably want to set a class column and bind to it draggable and droppable using .column as selector.
HTML:
<div id="column1" class="column" style="width: 400px; background-color: rgba(255, 0, 0, 1)">
<ul style="list-style-type: none;">
<li data-id="1"> <a href="#">
<img src="http://placehold.it/200x200" />
</a>
</li>
</ul>
</div>
<div id="column2" class="column" style="width: 400px; background-color: black">
<ul>
<li> <a href="#">
<img src="http://placehold.it/200x200" />
</a>
</li>
</ul>
</div>
jQuery:
$(document).ready(function () {
$(".column li").draggable({
revert: true,
drag: function () {
$(this).addClass("active");
var a = $(this).closest("#column").addClass("active");
},
stop: function () {
$(this).removeClass("active").closest("#column1").removeClass("active");
}
});
$(".column li").droppable({
tolerance: "touch",
drop: function (event, ui) {
alert('Hello World');
console.log($(this))
}
});
});
Demo: http://jsfiddle.net/IrvinDominin/CASn4/
I'm having a bit of an issue with an Ajax form. I've probably done it a bit backwards no doubt. Basically, when I hit the submit button in the form, nothing at all happens. I've debugged however it doesn't appear to post to the action method. It literally does nothing.
Here is my code so far:
Basically I post information from a form with the model of DetailedBreakdownReportRequest. This model is being passed through fine as my page displays the list of initial unfiltered results.
DetailedBreakdownReport Action Method:
[HttpPost]
public ActionResult DetailedBreakdownReport(DetailedBreakdownReportRequest reportRequest, FormCollection formVariables)
{
return View(reportRequest);
}
DetailedBreakdownReport View
<%# Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Main.Master" Inherits="System.Web.Mvc.ViewPage<MyApp.Data.AdvancedReports.AdvancedReports.DetailedBreakdownReports.DetailedBreakdownReportRequest>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Detailed Breakdown Report
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script language="javascript" type="text/javascript" src="<%= ResolveUrl("~/Scripts/jquery-1.4.1.min.js")%>"></script>
<script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<% using (Ajax.BeginForm("DetailedList", "Reports",
new AjaxOptions
{
UpdateTargetId = "panelBreakdownList",
InsertionMode = InsertionMode.Replace
},
new { id = "SearchForm" })) %>
<% { %>
<div style="position: absolute; top: 0px; height: 30px; right: -12px; margin-top: 8px;
width: 250px; padding-left: 00px; vertical-align: middle; display: inline-block;">
<input id="searchField" name="searchField" style="padding-left: 5px; position: relative;
float: left; top: 3px; margin: 0px; border: 1px solid #DDDDDD; height: 19px;
width: 200px;" />
<%: Html.HiddenFor(m => m.ToDate) %>
<%: Html.HiddenFor(m => m.FromDate) %>
<%: Html.HiddenFor(m => m.Currency) %>
<%: Html.HiddenFor(m => m.ReportType) %>
<!--<input type="image" src="/Content/Images/search-form-submit.png" style="border: 0px;
height: 27px; position: relative; left: -8px; margin: 0x; float: left;" />-->
<input type="submit" value="Search" style="border: 0px;
height: 27px; position: relative; left: -8px; margin: 0x; float: left;" />
</div>
<% } %>
<div id="panelBreakdownList" style="position: relative; z-index: 0;">
<% Html.RenderAction("DetailedList", new { ToDate = Model.ToDate, FromDate = Model.FromDate, Currency = Model.Currency, ReportType = Model.ReportType }); %>
</div>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="Header" runat="server">
<h1>Detailed Breakdown Report</h1>
<h2><%: Model.ToDate.ToString("dd-MMM-yyyy") %> to <%: Model.FromDate.ToString("dd-MMM-yyyy")%></h2>
</asp:Content>
Here is the DetailedList action that is called from the above page, and it's view:
[HttpPost]
public ActionResult DetailedList(DateTime ToDate, DateTime FromDate, string Currency, string ReportType, FormCollection formVariables)
{
DetailedBreakdownReportRequest reportRequest = new DetailedBreakdownReportRequest()
{
ToDate = ToDate,
FromDate = FromDate,
Currency = Currency,
ReportType = ReportType,
UserId = UserServices.CurrentUserId
};
DrilldownReportEngine re = new DrilldownReportEngine();
DetailedBreakdownReport report = null;
if (formVariables.HasKeys())
{
reportRequest.searchTerm = formVariables["searchField"];
report = re.GetDetailedBreakdown(reportRequest);
}
else
{
report = re.GetDetailedBreakdown(reportRequest);
}
return PartialView(report);
}
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<MyApp.Data.AdvancedReports.AdvancedReports.DetailedBreakdownReports.DetailedBreakdownReport>" %>
<% if (Model.HasData)
{ %>
<% if (Model.ShopBreakdown != null)
{ %>
<h2>Shop Breakdown Report</h2>
<p>Click on a shop's name to see additional information.</p>
<div id="shopGrid" style="float:left; width: 400px;">
<table width="400px">
<% foreach (var shop in Model.ShopBreakdown)
{ %>
<tr>
<td colspan="3"><h2><%: Html.ActionLink(shop.Shop.Name + " >>", "ShopDashboard", new { ShopId = shop.Shop.ShopID, Currency = Model.Currency, toDate = Model.ToDate.ToString(), fromDate = Model.FromDate.ToString(), percentageOfSales = shop.RevenuePercentageOfSales })%></h2></td>
</tr>
<tr>
<td><p class="labels">Units Sold:</p></td>
<td><b style="font-size:larger;"><%: shop.UnitsSoldPerShop%></b></td>
<td rowspan="2" align="center"><h2><%: String.Format("{0:0.0%}", shop.RevenuePercentageOfSales)%></h2> of Total Revenue</td>
</tr>
<tr>
<td><p class="labels">Revenue Earned:</p></td>
<td><b style="font-size:larger;"><%: String.Format("{0:0.00}", shop.TotalRevenuePerShop)%></b></td>
</tr>
<tr>
<td colspan="3"> </td>
</tr>
<% } %>
</table>
</div>
<% } %>
<% if (Model.ProductBreakdown != null)
{ %>
<% foreach (var product in Model.ProductBreakdown)
{ %>
<div id="ProductGrid" style="float:left; width: 500px;">
<div>
<h3><%: Html.ActionLink(product.Product.Name + " >>", "ProductDashboard", new { ProductId = product.Product.ProductID, Currency = Model.Currency, toDate = Model.ToDate.ToString(), fromDate = Model.FromDate.ToString(), percentageOfSales = product.RevenuePercentageOfSales })%></h3>
</div>
<div style="float:left; width: 200px;">
<p class="labels">Units Sold: </p><b style="font-size:larger;"><%: product.TotalUnitsSoldPerProduct %></b>
<br />
<p class="labels">Revenue Earned: </p><b style="font-size:larger;"><%: String.Format("{0:0.00}", product.OverallTotalRevenuePerProduct)%></b>
</div>
<div style="float: left; text-align: center;">
<h2><%: String.Format("{0:0.0%}", product.RevenuePercentageOfSales)%></h2> of Total Revenue
</div>
</div>
<% } %>
<div style="clear:both;" />
<br />
<% } %>
<% } %>
As I said above, on first load, the page displays fine, it displays an unfiltered view of the results. When I type in a value into the text box and click submit, nothing at all happens and I'm finding that hard to debug. At least if it did something I'd have something to work with. Can anyone see if I'm doing something wrong here?
As I see, you expect some not nullable variables in action detailedList which are expected from form.
[HttpPost]
public ActionResult DetailedList(DateTime ToDate, DateTime FromDate, string Currency, string ReportType, FormCollection formVariables)
{
......
}
But you just send searchfield in form collection. Where is the ToDate, FromDate, Currency variables in form?
I think you should create a formmodel forexample
DetailedListSearchModel
DateTime ToDate
DateTime FromDate
string Currency
string ReportType
string Searchfield
and make search a partialview. Just pass default values when partial view is rendered with default values then execute in form.
Then you will take this values in action like
[HttpPost]
public ActionResult DetailedList(DetailedListSearchModel model)
{
......
}
You can use this model in form like
<%= Html.LabelFor(m => m.Searchfield) %>
<%= Html.TextBoxFor(m => m.Searchfield, new { #class = "css classes", maxlength = "1000" })%>
<%= Html.ValidationMessageFor(m => m.Searchfield) %>
$(function() {
$('form#SearchForm').find('a.submit-link').click( function() {
$('form#SearchForm').trigger('submit');
}).show();
}
and change search button to a.
Search