I am using Microsoft Visual Studio Express to make a web page.
I used jQuery, to create a date picker from which I want to choose a date.
I want to read the date into a String in VB, so that I can modify it.
<%# Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/base/jquery-ui.css"
type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"
type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#<%= TextBox1.ClientID %>').datepicker();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</form>
</body>
</html>
In VB I have tried:
Partial Class _Default
Inherits System.Web.UI.Page
Dim temp As String
temp = TextBox1.value
End Class
Why does it not work?
How should I do it?
I just tried your example using C# asp.net and with 2 changes i m able to see date...
1. add AutoPostBack="True" in textbox
2. in .cs use TextBox1.Text (valid for C# not sure of VB)
Related
This is discouraging me - I'm using the latest version of .NET core, SDK, visual studio 2019,
Started new project - ASP.net core Razor pages, I'm tring to add #RenderPage("") without success.
It looks like it is not part of abstract class RazorPage (that inherit RazorPageBase, at the Microsoft.AspNetCore.Mvc.Razor namespace (part of dotnet\packs\Microsoft.AspNetCore.App.Ref\3.1.3\ref\netcoreapp3.1\Microsoft.AspNetCore.Mvc.Razor.dll))
Everything I try, there is an error that says:
Error CS0103 The name 'RenderPage' does not exist in the current context
my _Layout page looks like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>#ViewData["Title"] - TestApp</title>
#*<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />*#
<link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
<div>
#RenderPage("/Shared/_MenubarPage")
</div>
<div class="container">
<main role="main" class="pb-3">
#RenderBody()
</main>
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
#RenderSection("Scripts", required: false)
</body>
</html>
(Of course I have partial _MenubarPage.cshtml page within Shared folder)
Can anyone please tell me where am I doing wrong? Should I add some kind of an external nuget?
Try the following code snippet in (the asp.net core 3.1) _layout page.
<partial name="_MenubarPage" />
You can use #RenderPage("_MenubarPage.cshtml");.
You can also use #RenderPage("_MenuPage.cshtml", MyModel) which allows you to supply any model you like to the view by including it as a second parameter.
You can also use #{Html.RenderPartial("_MenubarPage");} if you are using a partial. But don't forget that you need to wrap it with the razor code block #{}
I have installed the Bootstrap using LibMan in Visual Studio with jQuery, and have added its reference in the _layout.cshtml file, but it is not working—meaning it is still showing content in the default browser style. Can you please help me find the issue?
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
#*// Bootstrap Libraries*#
<link href="~/lib/bootstrap/css/bootstrap.css" rel="stylesheet" />
<link href="~/css/StyleSheet.css" rel="stylesheet" />
#* Jquery Libs *#
<script src="~/lib/jquery/jquery.js"></script>
<title>#ViewBag.Title</title>
</head>
<body>
<div class="container">
#RenderBody()
</div>
#if (IsSectionDefined("Scripts"))
{
#RenderSection("Scripts", required: true)
}
</body>
</html>
base.ejs:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>My Diary</title>
<link rel="stylesheet" href="stylesheets/bootstrap.min.css">
<script src="javascripts/jquery.js" ></script>
<script src="javascripts/bootstrap.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
});
</script>
</body>
index.ejs:
<div class="container">
<!-- Button trigger modal -->
<h1>Welcome to Your Diary</h1>
<div>
<span class="label label-default">What would you like to do? </span>
<span class="label label-primary">Here are your Categories:</span>
</div>
</div>
I want block inheritance
EJS does not specifically support blocks, but layouts can be implemented by including headers and footers, like so:
<%- include('header') -%>
<h1>
Title
</h1>
<p>
My page
</p>
<%- include('footer') -%>
https://github.com/mde/ejs#layouts
You could split base.ejs into two files, header and footer, like this:
header.ejs
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>My Diary</title>
<link rel="stylesheet" href="stylesheets/bootstrap.min.css">
<script src="javascripts/jquery.js" ></script>
<script src="javascripts/bootstrap.min.js"></script>
</head>
<body>
footer.ejs
<script type="text/javascript">
$(document).ready(function(){
});
</script>
</body>
</html>
Someone has made EJS with block inheritance capability (https://github.com/mafintosh/pejs)
Straight from the documentation (Retrieved on January, 1st, 2018):
Using blocks it's easy to implement template inheritance. Just declare
a base.html with some anchored blocks:
<body>
Hello i am base
<%{{ content }}%>
</body>
Then a child.html that renders base.html
<%{ './base.html' }%>
<%{ content %>
i am inserted in base
<%} %>
To render the example just render child.html
pejs.render('./child.html', function(err, result) {
console.log(result);
});
Looks pretty good. I'm going to try this on my own project.
You can use ejs-locals or ejs-mate engine for ejs
Sorry for being late. I am in the same situation. What you can do is to pass the content you want to render in the properties of the object. Like this:
<%- include('/partials/',{
title: 'my title',
tags: [
'<h1>Hi, my name is this</h1>'
]
});
%>
EJS does not support blocks, but this is the solution I have implementate. Hope it helps.
I am trying to open a simple modal dialog and I have been struggling to do this. Can
any one please help? This is the HTML code(please remove pre). This simply doesnot work.
Can any one please tell **strong text**me why? I have not been getting the kind of output that I really
need.
Any one help me.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="css/magnific-popup.css" rel="stylesheet" />
<script src="js/jquery.magnific-popup.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" ></script>
</head>
<body>
<a class="popup-modal" href="#test-modal">Open modal</a>
<div id="test-modal" class="white-popup-block mfp-hide">
<h1>Modal dialog</h1>
<p>You won't be able to dismiss this by usual means (escape or
click button), but you can close it programatically based on
user choices or actions.</p>
<p><a class="popup-modal-dismiss" href="#">Dismiss</a></p>
</div>
<script>
$(function () {
$('.popup-modal').magnificPopup({
type: 'inline',
preloader: false,
focus: '#username',
modal: true
});
$(document).on('click', '.popup-modal-dismiss', function (e) {
e.preventDefault();
$.magnificPopup.close();
});
});
</script>
</body>
</html>
Load jquery before the magnific-popup plugin, it relies on jquery (I've never used it but I'm assuming so seeeing as it is pre-appended withfixed 'jquery')
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="css/magnific-popup.css" rel="stylesheet" />
<!-- Jquery loaded first here... -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" ></script>
<!-- Plugins after... -->
<script src="js/jquery.magnific-popup.js"></script>
</head>
<body>
I am using Visual studio 2012 to create a sample Windows 8 Phone app.
From the "Create New Project" option I have selected,
Windows > Windows Phone HTML5 App
I have also added a jquery.min.js file to the project as shown below.
Below is my code written in index.html...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/html/css/phone.css" />
<script type="text/javascript" src="/html/js/jquery.min.js" ></script>
<title>Windows Phone</title>
<script type="text/javascript">
$("#dynamic-box").text("hey !");
</script>
</head>
<body>
<div>
<p>MY APPLICATION</p>
</div>
<div id="dynamic-box"></div>
</body>
</html>
But no matter what I try my jquery code just wont work. Is there some other way in which jquery is to be written in Windows 8 Phone app ?
Please help me on this.
Two things going on here, one jQuery, one Windows Phone:
Put your code into the ready event (it won't work in a web page either as is)
<script type="text/javascript">
$(document).ready(function () {
$("#dynamic-box").text("hey!");
});
</script>
Set IsScriptEnabled BEFORE navigating to the opening page. Flip the order of the statements in Browser_Loaded in MainPage.xaml.cs.
private void Browser_Loaded(object sender, RoutedEventArgs e)
{
// Add your URL here
Browser.IsScriptEnabled = true;
Browser.Navigate(new Uri(MainUri, UriKind.Relative));
}
I recently wrote a post on this, thought it be useful to share it here...
Step 1 : Add jquery.min.js to the solution
Step 2 : Change the order of statement in Browser_Loaded method as shown below
private void Browser_Loaded(object sender, RoutedEventArgs e)
{
// Add your URL here
Browser.IsScriptEnabled = true;
Browser.Navigate(new Uri(MainUri, UriKind.Relative));
}
Step 3: Sample Jquery code
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/html/css/phone.css" />
<script type="text/javascript" src="/html/js/jquery.min.js" ></script>
<title>Windows Phone</title>
<script type="text/javascript">
$(document).ready(function () {
$("#message").text("Welcome !");
$("#goBtn").click(function(){
$("#message").text("button has been pressed");
});
});
</script>
</head>
<body>
<div>
<p>MY APPLICATION</p>
</div>
<div id="message"></div>
<input type="button" id="goBtn" value="press me !" />
</body>
</html>
Output