dijit.form.DateTextBox is not visible when the page is loaded - spring-webflow

When my page is loaded I cannot see calendar:
When I click on the birthday field of the form it appears, but it does not look as I expect:
The code I use to display in jsp file:
<label for="birthday">Birthday<br/> </label>
<sf:input path="birthday" id="birthday"
pattern="(0[1-9]|1[0-9]|2[0-9]|3[01])-(0[1-9]|1[012])-[0-9]{4}"/><br/>
<script type="text/javascript">
Spring.addDecoration(new Spring.ElementDecoration({
elementId:"birthday",
widgetType:"dijit.form.DateTextBox",
widgetAttrs:{ datePattern:"dd-MM-yyyy", required:true }}));
</script>
So my questions are:
How to make calendar always visible as soon as the form is loaded?
How can I manage with its css, so I could set backgournd and other properties via css file? If it is not possible, then via JavaScript params.
Thanks.

In order the calendar works I had to set the following css class to the html body element:
<body class="tundra">
It helped.

Related

Updating a page from another page without refreshing the page

I have two web pages written in VisualBasic.Net:
Upload.aspx
Default.aspx
There is a link in the Default page that opens Upload page in a different window.
In the Upload window I upload a file, and I want to display the name of this file in a textbox, which in turn is in a gridview on the Default page.
I think I want an asyncronous process that won't cause the Default page to refresh, but I don't know how to do this.
I created a very simple example for you. Here is the code of the first page (your Default.aspx let's say):
<html>
<head>
<script>
function ow() {
window.open('w2.html');
}
function update(updatestr) {
document.getElementById('update').innerHTML = updatestr;
}
</script>
</head>
<body>
open window
<div id="update"></div>
</body>
</html>
This page contains a link, which opens a new window (this will be your Upload.aspx page). It also contains a simple function called update, which puts a parameter value as a div html content.
This is code of a second page (your Upload.aspx like):
<html>
<head>
<script>
function update() {
window.opener.update(document.getElementById('txt').value);
}
</script>
</head>
<body>
<input type="text" id="txt" />
<input type="button" value="Update" onclick="update()"/>
</body>
</html>
This page contains a textbox and a button. After a button click, the content of the textbox will appear in a div on the first page. You can do something similar in your case.
I've put a working demo for you.

asp.net automatically open lightbox with the paramaters

I have a page in c# that redirects to another page like
Response.Redirect("default.aspx?name=" + user.Firstname + "&surname=" + user.Lastname).
default.aspx has a lightbox. I want to open this lightbox when I redirect the page that include this lightbox. Also, I want to show the parameters in that lightbox input fields. Is there a way to achieve this?
Thanks for any help.
I am afraid you cannot do it with Lightbox.
Lightbox plugin works on <a> tag and fetches value form href attribute. Also it specially design for Images as you can see if you provide a URL to page it doesnt load it.
For Intance,
if you provide,
<a href="page.html" id="a1" >Click Me</a>
it will keep showing the loading page.
Instead try using thickbox to show the current user parameters.
For thickbox to show a page you can use
<script language="javascript" type="text/javascript" src="javascript/thickbox.js"></script>
<a id="a1" href="#" title="Click me" class="thickbox">Call me</a>
<script type="text/javascript" >
$(document).ready(function(){
var anchor = document.getElementById("a1");
var username= '<%= Request.QueryString["username"]%>';
var url="second.html?height=500&width=700&modal=true&TB_iframe=true&username="+username;
$('#a1').attr("href", url);
anchor.click();
});
</script>
Let me know if it worked.

iFrame source can not be retrieved

<iframe id="myFrame" runat="server" name="main" width="100%" src="http://www.somewebpage.com/" />
This is simple iFrame I put on my webpage. After I click on couple of buttons on that website, iframe source remains the same. But I want to be able to retrieve the changed source every time I click on buttons, links etc...
How can I achieve this?
Edit: This is the screenshot of my work. When I click on "Git" button, webpage loads on the iFrame. However, when I surf on the website, I want textbox to be updated to the source of the iFrame.
Ok, here is an idea that I test it now and its work. You change the input box after the iframe loads using the onload event of the iframe
<script>
function HasChange(me)
{
document.getElementById("WhereIamId").value =
document.getElementById("WhatIShowID").src;
return false;
}
</script>
and the html
<input type="text" id="WhereIamId" value="" />
<iframe src="page1.aspx" onload="return HasChange(this);" id="WhatIShowID" ></iframe>
You can use also the document.getElementById("<%=myFrame.ClientID>") to get the rendered id. After your iframe loads you update the text box with the current url.

Add .js files at the bottom of the page from User Control

I have a user control on my web forms app and I need to reference a js file on the user control.
I would like to add this js file at the bottom of the output html page but I don't know how to do it from User Control.
I have following script references on my master page;
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.12/jquery-ui.min.js"></script>
<script src="http://ajax.cdnjs.com/ajax/libs/modernizr/1.7/modernizr-1.7.min.js" type="text/javascript"></script>
and they are staying just after the </body> tag at the bottom. I'm using my user control like below on a web form page;
<userControl:SearchEngine ID="SearchEngine" runat="server"></userControl:SearchEngine>
and from this user control, I would like to add the a js at the bottom of the outputted html markup after the 3rd js file which you can see above.
any idea?
Try using RegisterClientStartUpScript() method to inject it at the end of the page:
http://msdn.microsoft.com/en-us/library/aa478975.aspx#aspnet-injectclientsidesc_topic2
Add a literal control at the bottom and set its text property with the content of the javascript file.

How do I set the target frame for form submission in ASP.NET?

I have an asp.net page in an iframe where all links target _blank
<base target="_blank" />
But I want the form on it to submit to _self (i.e. the iframe where the page is located) when the one button is clicked. The form is an <asp:Panel> with an <asp:Button> control for submitting it.
Where can I set the target for this form? Since there isn't a <form> tag or an <input> tag in the file (ASP.NET makes them when it renders the page), I don't know how to change the target to override my <base> tag.
I'm not sure if I understood you right, but you can set the target in the form tag, like this:
<form method=post action="Page.aspx" target="_self">
I just found this post on the asp.net forums by mokeefe that changes the target by javascript.
I just put it in my page and tried it. I had to make these modifications:
1. I'm using asp tags only, so I have <asp:Button> not <input type="button"> and my onclick has to be the server-side method I'm calling on submission. Therefore I put this new javascript in OnClientClick:
<asp:Button ID="cmdEmailSearch" runat="server" Text="Search"
OnClick="cmdEmailSearch_Click"
OnClientClick="javascript:pageSubmit()"/>
2. I removed the myForm.submit() since ASP.NET renders the page putting the WebForm_DoPostBackWithOptions() javascript in the button's onclick right after it puts my pageSubmit()
<script type="text/javascript">
function pageSubmit(){
// where form1 is the Parent Form Id
var myForm = document.getElementById('form1');
myForm.target = '_self';
}// end function
</script>

Resources