Access Div tag in Page from Masterpage codebehind - webforms

I need access div in a page.
page.aspx
<asp:Content ID="Content" ContentPlaceHolderID="ContentPlaceHolderBody1" runat="server">
<div class="table-responsive">
<div class="card card-authentication1 mx-auto my-5" id="div_Payment" runat="server"></div>
</div
</asp:Content>
masterpage
protected void Admin_Load(object sender, EventArgs e)
{
HtmlControl control = (HtmlControl)Page.FindControl("ContentPlaceHolderBody1").FindControl("div_Payment");
HtmlControl control = (HtmlControl)Master.FindControl("ContentPlaceHolderBody1").FindControl("div_Payment");
control.Style.Add("display", "none");
}
no luck.

This should work:
Markup:
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<asp:Label ID="Label1" runat="server" Text="This is fun"></asp:Label>
<div class="table-responsive">
<div class="card card-authentication1 mx-auto my-5" id="div_Payment" runat="server">xxxx</div>
</div>
</asp:Content>
code behind on master page:
System.Web.UI.WebControls.Label MyLabel1 =
(System.Web.UI.WebControls.Label)MainContent.FindControl("Label1");
Debug.Print("Value of Lable 1 on child page = " + MyLabel1.Text);
HtmlGenericControl MyDiv = (HtmlGenericControl)MainContent.FindControl("div_Payment");
Debug.Print("Inner text = " + MyDiv.InnerText);
so, you don't have to "find" the first "content" control - that will exist.
(you could, but it not required).

I found it
HtmlControl MyDiv = (HtmlControl)Page
.Master
.FindControl("ContentPlaceHolderBody1")
.FindControl("Panel1");

Related

When I click back and forward Buton of browser all of my dynamically created PartialView get disappered

I can create multiple Partialviews in my view
Create.cshtml
#model Opto.Models.Recipe
....
<div id="Far" class="tab-pane active card-body">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="row form-group">
<div class="col">
<div class="text-left" dir="ltr">
<partial name="RecipeFarSighted.cshtml" Model="Model.FarSighted" />
</div>
<hr />
<div class="text-center" dir="rtl">
<div id="FarSightedBillsSection">
#*FarSightedBills will be created here by javascript*#
</div>
<a onclick="AddBill('far')" style="cursor:pointer"><img src="~/images/Plus.png" width="25" height="25" /></a>
<br /><br />
#if (!Model.FarSighted.Share)
{
<div class="form-group row form-check">
<label class="form-check-label col">
<input asp-for="FarSighted.Share" type="checkbox"> عدم دریافت عینک
</label>
</div>
}
</div>
</div>
</div>
<br />
</div>
...
#section Scripts{
<script>
var farIndex = 0;
var farRealCount = 0;
function AddBill(type)
{
tag = "<div id='farSightedBill" + farIndex + "' ><a onclick=\"RemovePartial('far'," + farIndex + ")\" style='cursor: pointer'><img src='/images/Minus.png' width='25' height='25' /></a><h4><a onclick=\"$('#farSighted" + farIndex + "').collapse('toggle')\" style='cursor: pointer' data-target='#farSighted" + farIndex + "' id='farBillTitle" + farIndex + "' > عینک دائمی " + (farRealCount + 1) + "</a ></h4 > <br /><div class='collapse' id='farSighted" + farIndex + "'></div></div > ";
$.get('/Glasses/DisplayFarBill?index=' + farIndex +
'&packFactor=' + '#(Model.FarSighted?.PackFactor)' + '&lenseCover=' + '#(Model.FarSighted?.LenseCover)',
function (partial) {
$('#FarSightedBillsSection').append(tag);
$('#farSighted' + farIndex).append(partial);
$('#farSighted' + farIndex).collapse('show');
//aaa(farIndex);
farIndex++;
farRealCount++
});
}
</script>
}
when I click the Back button of the browser and then forward, all my partial views will be disappeared. how can I solve this?
and when I go to submit action method in the controller for validation and there are some errors in it, when it goes back to view there are no parts in it, what should I do?
Firstly,the Back and Forward button is used for navigating through visited Web pages.And it may uses BFCache,it will cache the whole page including jquery(Source code).And the partial view you added will not shown after Back,Forward click is because it is added by jquery.jquery will change the html code,but will not change the source code.When you click Back,Forward button,browser will reload the Source code,and render it to html code.If you want to show the partial view,you can only add them directly like this in your code:
<div class="text-left" dir="ltr">
<partial name="RecipeFarSighted.cshtml" Model="Model.FarSighted" />
</div>

Kendo mobile view parameters

I have a a basic kendo view and am wondering if there is a way to access the view.params without using the data-show or data-init to run a js OR if i do use the current functon call on data-show how can i dynamically populate the data elements of my EDIT button?
<!-- eventDetail view -------------------------------------------------------------------------------------------------->
<div data-role="view" id="view-eventDetail" data-show="getEventDetailData" data-title="eventDetail">
<header data-role="header">
<div data-role="navbar">
<span data-role="view-title"></span>
<a data-align="left" data-role="button" class="nav-button" href="#view-myEvents">Back</a>
<a data-align="right" data-role="button" class="nav-button" data-click="showEventUpdate" data-event_id="view.params.event_id" data-user_id="view.params.user_id">Edit</a>
</div>
</header>
<div id="eventDetail"></div>
</div>
The best method i have found so far (access view parameters in view) is to use the Kendo ViewModel method - MVVM - and the template - pulling in the view.params from a querystring click:
<a data-role="button" href="#view-Home?userID=2&userType=1&trainerID=2">
Then call a script via the data-show or data-init method of the view and bind the viewModel:
<!-- =========================================================================================== Home page -->
<div data-role="view" id="view-Home" data-title="Home" data-show="checkAuth" data-model="home_viewModel" >
<div id="homeWrapper">
<div id="myTrainerInfo" data-template="myTrainerIcon-template" data-bind="source: user_info" ></div>
</div>
<!-- ========================================================================================= Home script -->
<script>
//init the viewmodel
var home_viewModel = kendo.observable({
user_info: []
});
function checkAuth(e) {
var userID = e.view.params.userID;
var userType = e.view.params.userType;
var trainerID = e.view.params.trainerID;
var userData = {userID:userID,userType:userType,trainerID:trainerID};
//set the viewmodel data
home_viewModel.set("user_info", userData);
}
</script>
The vars can then be accessed via ${var_name} or via HTML data-bind="value: var_name":
<!-- ============================================================================== myTrainerIcon template -->
<script id="myTrainerIcon-template" type="text/x-kendo-template">
<div id="myTrainerIcon" class="homePageIcons">
<a data-role="button" href="\\#view-trainerDetail?user_id=${userID}&trainer_id=${trainerID}">
<img src = "styles/icons/myTrainerICON.png" alt="myTrainer" />
</a>
<div class = "icon-text" >myTrainer</div>
</div>
<div>TrainerID: <input name="edit_id" id="edit_id" data-min="true" class="k-input" data-bind="value: trainerID" type="text" /></div>
</script>
Im sure there is a different way to do this but so far nothing i have discovered on my own..

How to Preview uploaded image using telerik RadAsyncUpload and RadBinaryImage in ASP Update Panel?

I have a web form in asp.net contains a RadAsyncfileupload and a RadBinaryImage inside an Asp Update Panel like following
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:UpdatePanel runat="server">
<ContentTemplate>
<telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server">
</telerik:RadAsyncUpload>
<telerik:RadBinaryImage ID ="RadBinaryImage1" runat ="server" Width= "100px" Height="100px"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
in code behind
protected void RadAsyncUpload1_FileUploaded(object sender, Telerik.Web.UI.FileUploadedEventArgs e)
{
if (RadAsyncUpload1.UploadedFiles.Count == 1)
{
byte[] image;
long fileLength = RadAsyncUpload1.UploadedFiles[0].InputStream.Length;
image = new byte[fileLength];
RadAsyncUpload1.UploadedFiles[0].InputStream.Read(image, 0, image.Length);
RadBinaryImage1.DataValue = image;
}
}
but in runtime program controller does not fire RadAsyncUpload1_FileUploaded event
I have searched the Telerik forum and found that I should do something to script manager but I need some help on how to do it the reason is that in order to fire this event whole page should post back anyway some scripts can help me or any other ways!
mention that I need byte array of the image to save it in DB.
Thanks in advance
Saeed Soleimanifar
http://demos.telerik.com/aspnet-ajax/asyncupload/examples/persistuploadedfiles/defaultvb.aspx?#qsf-demo-source
I just added the same functionality by using this , if you find any problem let me know...
OR
Here is the part that does the magic
Page Source :
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
function updatePictureAndInfo() {
__doPostBack('btnImgUpload', 'RadButton1Args');
}
</script>
</telerik:RadScriptBlock>
<telerik:RadBinaryImage runat="server" ID="imgBinaryPhoto" ImageUrl="~/Images/default-profile-pic.png"
Width="100px" Height="100px" ResizeMode="Fit" AlternateText="No picture available"
CssClass="preview"></telerik:RadBinaryImage>
<br />
<telerik:RadAsyncUpload ID="upldPhoto" runat="server" AllowedFileExtensions=".jpg,.png,.gif,jpeg,.tiff"
MaxFileInputsCount="1" MultipleFileSelection="Disabled">
</telerik:RadAsyncUpload>
<asp:Button ID="btnImgUpload" runat="server" Text="Upload" CssClass="button" OnClientClick="updatePictureAndInfo(); return false;" />
Code Behind:
Protected Sub FileUploaded() Handles upldPhoto.FileUploaded
Dim bitmapImage As Bitmap = ResizeImage(upldPhoto.UploadedFiles(0).InputStream)
Dim stream As System.IO.MemoryStream = New System.IO.MemoryStream()
bitmapImage.Save(stream, System.Drawing.Imaging.ImageFormat.Bmp)
imgBinaryPhoto.DataValue = stream.ToArray()
End Sub

MVC3: How to correctly call Ajax to update PartialView

I have 2 Actions in my controller:
// GET: /Directory/
public ActionResult Index()
{
ViewModels.DirectoryIndex model = new ViewModels.DirectoryIndex();
return View(model);
}
// POST: /Directory/Filter/[viewModel]
[HttpPost]
public ActionResult Filter(ViewModels.DirectoryIndex viewModel)
{
int distance = 0;
string state = string.Empty;
if (viewModel.SelectedDistance > 0)
distance = viewModel.SelectedDistance;
else if (viewModel.SelectedState > 0)
state = viewModel.States.Where(a => a.Value == viewModel.SelectedState.ToString()).FirstOrDefault().Text;
// TODO: Add filter activities here...
return PartialView("IndexPartial", viewModel);
}
I have a View and a PartialView (NOTE: I am not using Razor!)
The view looks like:
<%# Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<RainWorx.FrameWorx.MVC.ViewModels.DirectoryIndex>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<div class="Column12">
<div class="Shadow"></div>
<h2 class="h2row"><%= Model.PageTitle %></h2>
<% using (Ajax.BeginForm("Filter", new AjaxOptions { UpdateTargetId = "filteredList" })) { %>
<div class="searchDirectory">
<label title="State">State: </label>
<%= Html.DropDownListFor(a => a.SelectedState, Model.States, "-- Select One --", new { #id = "ddlStates" })%>
-or-
<label title="ZipCode">Zip Code within: </label>
<%= Html.DropDownListFor(a => a.SelectedDistance, Model.Distance, "-- Select One --", new { #id = "ddlDistance" })%>
<input type="text" id="myZip" name="myZip" />
<input type="submit" value="Filter" />
</div>
<% } %>
<div id="filteredList" class="businessCard">
<% { Html.RenderPartial("IndexPartial", Model); } %>
</div>
<div style="height: 200px;"></div>
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="head" runat="server">
<link type="text/css" href="Content/css/directory.css" rel="Stylesheet" />
<script src="Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript" />
<title><%= Model.PageTitle %></title>
</asp:Content>
The PartialView looks like:
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<RainWorx.FrameWorx.MVC.ViewModels.DirectoryIndex>" %>
<% foreach (var d in Model.Dealers) { %>
<div class="businessCard Outline">
<div class="businessCard Logo">
<img src="<%= Url.Content("~/Content/Images/Directory/logo01_150wide.png") %>" alt="Logo" />
</div>
<div class="businessCard Info">
<div class="businessCard Name"><%= d.Name %></div>
<div class="businessCard Address"><%= d.Address %></div>
<div class="businessCard City"><%= d.City %>, <%= d.State %> <%= d.ZipCode %></div>
<div class="businessCard Phone"><%= d.Phone %></div>
</div>
</div>
<% } %>
Now, for some reason, when I select a filter to use and submit the form it does call into the second action correctly. However, it does not refresh the PartialView, instead I get the PartailView rendered as a full view. In URL terms:
I start at http://mysite.com/Directory - select my filter, click submit.
I end at http://mysite.com/Directory/Filter when I expect to end at http://mysite.com/Directory !!
I am obviously missing something simple. I've done this before in Razor (love Razor over this mess BTW) and it all works there.
NOTE: This is a 3rd party product I am extending so don't have the luxury of converting everything to Razor.
You need to have both the following files referenced in your html. I think there is a jQuery alternative... but referencing both of these JavaScript files (which are probably already in your MVC solution) should solve your problem.
<script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>

ASP.NET Button Inside Repeater Inside UpdatePanel Won't Fire!

ASP.NET 3.5 SP 1 / Visual Studio 2008 V 9.x RTM
I am trying to get a button inside a repeater inside an updatepanel to fire.
I't won't. I have tried adding a trigger outside the ContentTemplate and inside
the UpdatePanel to no avail:
<Triggers>
<asp:AsyncPostBackTrigger ControlID="BtnAddStatus" EventName="Click" />
</Triggers>
In fact, the AsyncPostBackTrigger's ControlID is always red and tells me "Cannot Resolve Symbol". This seems to be the case no matter where on the page I put the trigger.
I have read posts that have solved this problem by putting the button outside
of the UpdatePanel but then, graphically speaking, the button will not be in the
correct spot. It needs to be DIV with the ID of btnDiv.
So... how do I get the below button to fire?
<asp:Button ID="BtnAddStatus" CssClass="small button Detail" Text="Share" runat="server" />
ASPX code as follows:
<asp:Content ContentPlaceHolderID="ContentCenter" runat="server">
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Always" runat="server">
<ContentTemplate>
<asp:Label ID="lblMessage" runat="server"></asp:Label>
<asp:Repeater ID="repFilter" runat="server"
onitemcommand="RepFilterItemCommand">
<HeaderTemplate>
<div class="UIComposer_Box">
<span class="w">
<asp:TextBox class="input" ID="txtStatusUpdate" TextMode="MultiLine" Columns="60"
name="txtStatusUpdate" Style="overflow: hidden; height: 40px; color: rgb(51, 51, 51);"
runat="server"></asp:TextBox>
</span>
<br clear="all">
<div id="btnDiv" style="padding: 10px 5px; height: 30px;" align="left">
<span style="float: left;"> PHP, Codeigniter, JQuery, AJAX Programming +
Tutorials ( <a href="http://www.x.info" target="_blank" style="color: rgb(236, 9, 43);">
www.x.info</a> ) </span>
<asp:Button ID="BtnAddStatus" CssClass="small button Detail" Text="Share" runat="server" />
</div>
</div>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="Label1" Text='<%# ((Alert)Container.DataItem).Message %>' runat="server"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<br class="clear" />
</FooterTemplate>
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
AND MY PAGE LOAD CODE:
protected void Page_Load(object sender, EventArgs e)
{
_presenter = new DefaultPresenter();
_presenter.Init(this);
}
AND THE BtnStatusClick Method:
protected void BtnAddStatusClick(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
var su = new StatusUpdate
{
CreateDate = DateTime.Now,
AccountId = _userSession.CurrentUser.AccountId,
Status = "" //txtStatusUpdate.Text
};
_statusRepository.SaveStatusUpdate(su);
_alertService.AddStatusUpdateAlert(su);
_presenter = new DefaultPresenter();
_presenter.Init(this);
}
}
Thanks again.
Have you tried setting the click event in the button instead of handling it from the code behind?
<asp:Button OnClick="BtnAddStatusClick" ID="BtnAddStatus" CssClass="small button Detail" Text="Share" runat="server" />

Resources