The telerick:RadAsynUpload element is not appearing in my aspx document - asp.net

<telerik:RadAsyncUpload runat="server" ID="ClientLogoAsyncUpload"
Width="200px"
MultipleFileSelection="Disabled"
AllowedFileExtensions=".jpeg,.jpg"
MaxFileInputsCount="1"
OnClientFileSelected="clientLogoClientFileSelected"
>
<Localization Select="<%$ Resources:Frm, Select %>" />
</telerik:RadAsyncUpload>
<telerik:RadProgressArea runat="server" ID="ClientLogoRadProgressArea"></telerik:
</div>
<div style="color:red;"><%= Resources.Frm.OnlyJPGAllowed %></div>
I am currently working on making an input form which the user can upload a photo as the logo .
However even though I copied the actually functioning code from other document which uses the form of the same format, the upload button which is supposed to be place right under the default logo is not appearing.
Select Logo Not Visible
I add the captured image of how it should look like when it is renders successfully.
Select Logo in Place
As mentioned above, these two forms share the same lines of code to render, so I am afraid the issue is not laid within the aspx files themselves.
What do I might have to look into to make the telerik:RadAsyncUpload element visible on my document?

Related

aspx TextBox not displaying html characters

I have a web application which has a TextBox:
asp:TextBox runat="server" CssClass="form-control monospace" ID="SKEDescriptionTextBox" TextMode="MultiLine" Rows="10" Text='<%# Bind("SKEDescription")%>' />"
It is bound to a field SKEDescription which is derived from an old mainframe application and is simply text - with no formatting. (old green screen stuff)
Within the web app, the user can change this TextBox and the resultant text gets sent back to the mainframe - after a large amount of code to strip formatting and other characters which will upset the mainframe.
However, if the user enters any text which even looks like HTML (e.g. ) then the code fails even before it enters the checking code. This was solved by adding
ValidateRequestMode="Disabled"
to the TextBox asp: line.
So now the user can enter and it is successfully sent to the mainframe,
BUT when the screen is redisplayed all the new text is displayed EXCEPT - it is not there.
Is there another method/property of TextBox that controls what is displayed from the Bind source rather than the user input?
And as an aside this textbox I am typing into to describe the problem has exactly the same issue - I originally entered the code snippet at the top starting with the less than sign and the snippet was removed only the final /> was visible. Editing this box and removing the initial sign and the whole snippet appears by magic.!!!
As with this Stack Overflow page my page actually had two TextBox controls that occupied the same area of screen depending on whether the screen was in display mode or edit mode.
The snippet in the original post above showed the Edit TextBox. The Display control was
asp:Literal ID="litSKEDescription" runat="server" Text='<%# Bind("SKEDescription") %>' />
The addition of Mode= "Encode" to this snippet enables (apparent) html text to be displayed

Same piece of code works on one page & doesnt work on other Page, asp.net

nesting of image inside a LinkButton shows image on one page & doesn't show image on another page below are two sample code from two different pages in the same root director.It works fine on one page but on the other page is doesn't show any download image rather shows the text download in place of image.
I have done troubleshooting for sometime and replace the code also but it doesnt show download image for any reason on the second page..
<asp:LinkButton ID="lnkbtnDownload" runat="server" onclick="lnkbtnDownload_Click" meta:resourcekey="lnkbtnDownloadResource1">
<asp:Image ID="imgDownload" runat="server" ImageUrl="~/images/download.png" meta:resourcekey="imgDownloadResource1" />
</asp:LinkButton>
<asp:LinkButton ID="lnkbtnDownload" runat="server" onclick="lnkbtnDownload_Click" meta:resourcekey="lnkbtnDownloadResource1">
<asp:Image ID="imgDownload" runat="server" ImageUrl="~/images/download.png" meta:resourcekey="imgDownloadResource1" />
</asp:LinkButton>
HTML OUTPUT
HTML for above two code sample render as below
<img alt="Download" src="images/download.png" id="MainContent_imgDownload">
Download
Both Pages are in the same root directory...
The problem probably comes from a discrepancy in your resource files or missing a resource file completely for the second page. Obviously you have one for the first, but possibly not for the other which has different naming.
If you are using meta:resourcekey, there are some things you have to considerate.
Make sure that your local resource files meet the following criteria:
They are in an App_LocalResources folder.
The base name matches the page name.
For example, if you are working with the page named Default.aspx, the
resource files are named Default.aspx.resx (for the default
resources), Default.aspx.es.resx, Default.aspx.es-mx.resx, and so on.
The resources in the file use the naming convention
resourcekey."property". For example, key name Button1."Text".
Source: MSDN

Colorbox and ASP.NET in a bound Datalist

My images are stored in a SQL database. I bind to the table and use the generated image control and a ashx handler. No problem. I now have the thumbnail image surrounded by a anchor tag. The problem come in finding the large image thats in a hidden div and display ONLY that.. I don't want a gallery just that one image. If you are reading this you know that datalists when generating their controls assigns mangled ID's to their components. How can I address that image from my thumbnail image?
<asp:DataList ID="datalist" runat="server" RepeatColumns="3" RepeatDirection="Horizontal">
<ItemTemplate>
<a class="colorme" href="#">Actual thumbnail image</a>
<div style="display:none">
<div id="colorme" runat="server">Actual image to display
</div>
</div>
</ItemTemplate>
</asp:DataList>
ASP.NET 4.0 no master page.
Assign ID and run at server for your Image and use
<%= yourimage.ClientID %> this will return that particular image wherever you'll use it..not the mangled IDs generated by Datalist control.
The simplest solution would be to use jQuery, and find the element using the next-sibling selector.
$(".colorme").click(function(){
$(this).find("~ div").show();
});
This would work no matter how many images you have on the page.

Can I use update panels with jQTouch?

I am using ASP.NET controls to fill in HTML for my jQTouch application, but I am having trouble with my hrefs ceasing to function as intended on my search page. The jQuery function for my anchor class evidently does not get called; it simply links back to the default page, even though the link is built similarly on other pages without any problems.
This is where my links are breaking:
<form id ="form1" runat="server" class="form">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel runat="server" ID="up1">
<ContentTemplate>
<ul class="rounded">
<li><asp:TextBox ID="txtSearchString" runat="server" name="search-articles" placeholder="Search GROK"></asp:TextBox></li>
<li><asp:Button ID="btnSearch" runat="server" Text="Search" type="rounded" OnClick="btnSearch_Click"></asp:Button></li>
</ul>
<asp:Literal ID="litSearchResults" runat="server"></asp:Literal> <%--HTML for jQTouch inserted here--%>
</ContentTemplate>
</asp:UpdatePanel>
</form>
This is an example of the HTML generated by code behind.
<ul class="edgetoedge"><li class="sep">Found 101 articles</li><li>PAWS: How to Access the Sample Test Database</li><li>Mac OS X: Hardware Test</li><li>The JavaScript Test</li><li>PAWS: Emergency Text Message Test</li><li>Definition: remote digital loopback test</li><li>Definition: power-on self test</li><li>Definition: power-on self test</li><li>AVG 9.0 Free Edition: Setting Scan Process Priority</li><li>Microsoft Office 2007: Diagnostics</li><li>Moodle: Description of Aggregation Methods</li><li>AVG 9.0 Free Edition: How can I run the complete scan of whole computer?</li><li>LSU A-Z: Office of Assessment and Evaluation</li><li>Linux: sed Insert a Newline Into the RHS of a Substitution</li><li>Microsoft PowerPoint 2007: Narrating a Slide</li><li>Ubuntu: Deleting Undeletable Files In the Trash</li><li>Linux: Remove All Digits/ Input From Inputs</li><li>SQL: Create a MySQL DocDB Databse</li><li>Linux Gnome: Screens and Graphics</li><li>Linux Xfce: Adjust keyboard settings</li></ul>
jQTouch handles every other tag normally, it is just the anchors that have ceased to function as intended by being placed inside this form. Can I keep using update panels here or will it inevitably break? Is there a work-around? Or am I approaching the problem incorrectly?
Keep in mind I want to retain the AJAXical animations produced by jQTouch. If you find that I am unclear or you would like to see more code (I only included what I believe to be necessary), please let me know.
Bonus points if you can tell me how to get jQTouch to replace the ugly the ASP.NET button control with an iPhoney button. :)
I think you are going to have to do a ton of hacks to get ASP.Net working with jqtouch with update panels, as you are going to be fighting the JavaScript inserted by ASP.Net with the JavaScript that jqtouch inserts. In your example all your links are going to the same anchor (#article). To do this in a jQtouch kind of way, you would have all the the links going to '#' and handle the tap of the articleLinkClass and then adjust as you need to.
$('.articleLink').tap(function()
{
var id = $(this).val('id');
// Pseudo CODE HERE FOR Setting up the article based on id... E.g.
$.json(jsonServiceUrl, { article_id: id }, function(data)
{
$('#article data).html(data);
});
jQt.goTo('article'); // Display the article page...
});
The iPhoney buttons are created in jQtouch as 's with their class as "whiteButton", i.e.:
<a id="myTestButton" class="whiteButton">Test Button</a>
Hope this helps...

Trying to move around asp.net panels around dynamically on postback

I have 2 sections of my website I am developing, a reference box that has a fixed width and a working box that has the same height as the content. I am trying to make it so the user can swap the content between the two boxes. I have the following type of setup in the aspx page:
<asp:panel id="pnlReference" runat="server" CssClass="referencePanel" >
<asp:panel id="pnlsection1" runat="server" >
Content....
</asp:panel>
</asp:panel>
<asp:linkbutton id="lbtSwapPanels" runat="server" />
<asp:panel id="pnlWorking" runat="server" CssClass="workingPanel" >
<asp:panel id="pnlSection2" runat="server" >
Content....
</asp:panel>
</asp:panel>
What I am trying to have occur is when I press the lbtSwapPanels linkbutton, it moves pnlSection1 into pnlWorking and pnlSection2 into pnlReference. The code I used to do this in the OnClick method was:
Control pane1, pane2;
pane1 = pnlWorking.Controls[0];
pane2 = pnlReference.Controls[0];
// Remove them from their respective panels
pnlWorking.Controls.Remove(pane1);
pnlReference.Controls.Remove(pane2);
// Add them to the opposite pane
pnlWorking.Controls.Add(pane2);
pnlReference.Controls.Add(pane1);
Unfortunately, this does not work. When I click the linkbutton, nothing happens. If I then do something to perform another postback the reference and working panels become empty. I assume this has to do with the change not being saved into Viewstate but I don't know how to get around that.
Does anyone have any ideas on how to do this?
Update: It seems that moving objects around with Jquery is causing issues with asp.net postbacks as well as making my asp.net ajax tabcontainer completely fail to function. After 2 swaps and postbacks, further postbacks cease to function at all. Here's the new code
<div id="referencePane">
<asp:panel id="pnlsection1" runat="server" >
Content with tab container
</asp:panel
</div>
Swap Panes
<div id="workingPane">
<asp:panel id="pnlsection2" runat="server" >
Content
</asp:panel>
</div>
Here's the javascript:
function SwapPanes() {
var pane1, pane2;
pane1 = $("#workingPane").html();
pane2 = $("#referencePane").html();
$("#workingPane").empty();
$("#referencePane").empty();
// Add them to the opposite pane
$("#workingPane").prepend(pane2);
$("#referencePane").prepend(pane1);
}
First postback causes the tabcontainer to fail (javascript exceptions claiming it's trying to create a tab container with teh same ID (only one exists in the original aspx page). Postbacks then proceed to do wierd stuff.
Have you thought about keeping the controls in the panel but just swapping the position of the panels? You can do this pretty easily in JQuery although you'll be using DIVS instead of ASP.NET panels. This is, again, quite easy since Panels just translate to DIVS in the end. I did this recently for a wizard-style questionnaire (moving from panels to divs) and I was surprised how easy it was.
Update: Note that, when you swap the div positions, you can change the style as well (again, easy in JQuery) so that the user won't have a jarring "why did these two things change position" experience.
The bottom line, really, is that I think you are trying to use a hammer to drive a screw. JQuery is the screwdriver you are looking for and learning it is very much worth your while!
Look into ASP.Net web parts. That will manage the whole thing for you in a dynamic and responsive way.

Resources