Render page from view via javascript - c#

I want to render the page when i click on particular div.
For that i written div as:
<div id="idFlip" onclick="javascript:renderPages();">
-----------content---------------------
</div>
written javascript function as:
function renderPages()
{
alert("Inside");
#RenderPage("~/Views/PP/Teacher_Observation.cshtml");
}
But its showing me that page while the page itself is load.(i.e. showing me both views current one and Teacher_Observation.cshtml
Its not showing me on div click.
What can i do???
Please help me.
I want to render page on click of div through javascript function

You could render the view on page load inside of a hidden div e.g:
<div id="idFlip">
<div id="i-am-the-view" style="display:none">
I am some hidden content
</div>
</div>
And then in Javascript/jQuery:
$(document).ready(function(){
$('#idFlip').click(function(){
$('#i-am-the-view').toggle();
});
});

Related

I have two panel side by side in content page.when click on button on 1st panel 2nd panel fields are responding

this is my html code
<div id="page-wrapper" class="gray-bg dashbard-1">
<div class="content-top">
<%-- <div class="row"--%>
<iframe src="http://www.gmail.com" style="width: 1350px; height:650px">
</iframe>
</div>
</div>
when i load this page it is redirecting to gmail ste.
can tell me what is problem
Your whole page is filled with iframe and that iframe s loading gmail.com.

access div tag inside form tag of master page

I have a div inside the form tag of master page.
I want to change it dynamically as and when a page loads.
I am building a e-commerce web site where in I have a cart icon along with which I display the total amount corresponding to a user.
This Cart tag and the amount tag is inside the form tag of master page and I cannot find it from the code behind using HtmlGenericControl.
C# code
HtmlGenericControl myObject = new HtmlGenericControl();
myObject = (HtmlGenericControl)Master.FindControl("simpleCart_total");
Html code
<div class="ca-r">
<div class="cart box_1">
<a href="../ShoppingCart.aspx">
<h3> <div class="total">
<span class="simpleCart_total" runat="server" style="display:none"></span> </div>
<img src="/images/cart.png" alt=""/></h3>
</a>
How do i access the simpleCart_total from code behind of master page itself to change it accordingly.
Please Help
Thank You

onClick bind to Url.ActionLink only works first time

So I have a Url.ActionLink, that when clicked, I want to load a partial view into a modal. This works the first time, but the second time it redirects the browser to the partial view instead of loading it into a modal, and the modal() call has an error saying that it is undefined.
The html for the div is:
<div class="modal fade" id="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body" id="modalBody"></div>
</div>
</div>
</div>
The code for the binding/loading so far is:
$(".actionLink").on("click", function (e) {
e.preventDefault();
$("#modalBody").load(e.target.href);
$("#modal").modal('show');
return false;
});
The error that I'm getting before the redirect is on the $("#modalBody").load(e.target.href); and the error is "Uncaught TypeError: undefined is not a function." It works the first time a link is clicked, so I don't know why it would be undefined the second time.
The .on() type of binding works only with the elements which was created before the script has been initialised.
So if you load some content dynamically in the on click function, the on() binding won't work for that content.
One solution could be if you bind the click event to the container element, where you load the new content, something like this:
$("#container").on("click", ".actionLink", function(e) { ... });
"Event handlers are bound only to the currently selected elements; they must exist on the page at the time your code makes the call to .on()"
jQuery .on() doc

Web Page Print Preview

I'm creating an online application form.
In front page, There are First Name, Last Name, Email etc... form inputs. What I want is that
if user fills the form and click on the submit, I want to show him the print preview page with values which user filled... Is it possible? I'm using ASP.Net C#
If you can use jquery this code is good
$(document).ready(function () {
window.print();
});
and you can see these
http://www.designplace.org/tutorials.php?page=1&c_id=27
http://www.alistapart.com/articles/goingtoprint/
https://web.archive.org/web/20211029043752/https://www.4guysfromrolla.com/webtech/061103-1.shtml
If you can use javascript, then try this
<script type="text/javascript">
function CallPrint(strid) {
var prtContent = document.getElementById(strid);
var WinPrint = window.open('', '', 'letf=0,top=0,width=850,height=800,toolbar=0,scrollbars=1,status=0');
WinPrint.document.write('<html><head><title>Popup</title>')
WinPrint.document.write('</head><body>');
WinPrint.document.write('</body></html>');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
}
</script>
Take a print button on the page
<input id="btnPrint" type="button" value="Print" runat="server"
onclick="javascript:CallPrint('divPrint')"/>
and Place your Controls which are to be printed within a div
<div id="divPrint">
//Your controls
</div>

MVC2 C#: How can I populate a contentplaceholder with html from a file?

So.. The issue I have came across is I am migrating a client's web app to MVC2, and the original method for displaying html content is not capable of working with MVC so I am needing to update it. The functionality I need is like so: There is a side nav that will contain the actions, and say the user clicks on "FooBar" it will populate the "mainContent" placeholder with the "FooBar.html" file from a document directory. I would like to do this with no postbacks as well if it is possible. Any ideas?
You may use jQuery ajax to load the pages when user clicks on the link. load() function will be ideal here.
It is just HTML and javascript. Nothing specific to ASP.NET MVC
//Include jQuery library
<div>
<a href="Home/about" class="aLink" >About</a>
<a href="Home/FAQ" class="aLink" >FAQ</a>
<a href="Home/Contact" class="aLink" >Contact</a>
</div>
<div id="mainContent">
</div>
<script type="text/javascript">
$(function(){
$("a.aLink").click(function(e){
e.preventDefault(); // prevent the default navigation behaviour
$("#mainContent").load($(this).attr("href"));
});
});
</script>

Categories