jquery mobile linkbutton not working - jquery-mobile

I am starting with JQuery mobile, and I have a verty strange problem, my app is very simple, it's a page with a TextBox, a button and a Linkbutton:
<div data-role="content">
<asp:TextBox ID="TextBox_Topic" runat="server"></asp:TextBox>
<asp:Button ID="Button_add" runat="server" Text="Add" onclick="Button_add_Click" />
<asp:LinkButton ID="LinkButton_grid" runat="server" PostBackUrl="multisubsGrid.aspx" data-role="button">Continue</asp:LinkButton>
</div>
The only thing I have to do is insert text in the textbox, and when the add button is clicked add it to a Session variable (a list), and then click on the Linkbutton to go to another page.
This is a very simple behaviour, and it worked fine before adding jquery mobile library. The problem is that when I insert some text and click the add button (it adds the text to the session variable) the LinkButton does not work, and I can't understand why is this happening.
this is my code behind:
protected void Button_add_Click(object sender, EventArgs e)
{
List<string> l = Session["topics"] as List<string>;
if (!l.Contains(TextBox_Topic.Text))
l.Add(TextBox_Topic.Text);
}
Hope somebody can help me.
Thanks!!!

jQuery Mobile uses Ajax to load pages and the asp.net web forms postback model simply doesn't work with this default behavior. Your only option (other than moving to a different server side technology) is to turn off Ajax loading. Using the PostBackUrl attribute on a button performs a server-side redirect.
You will need to turn off Ajax loading on your <form data-ajax="false"> tag and/or button. <asp:LinkButton data-ajax="false">Continue</asp:LinkButton>. I am not sure what behavior the PostBackUrl will introduce.
asp.net MVC is a much better choice if you want to stay with a Microsoft technology. I have also had success using straight html files for my markup and then connecting to asp.net (web form) asmx / web services if you really want to stick with web forms but this this will require heavy use of JavaScript and client-side programming.
Ajax loading is used mostly for performance and to come closer to native acting applications. If your application is intended only for intranet use or a limited audience, you can likely get away with just turning it off.

Related

Show a warning for an upcoming maintenance on every page in ASP.NET MVC

I have an ASP.NET MVC web application. Before deploying a new version of my application to the server I want to inform my clients about the downtime a few hours before. That's why I want to show a small dialog on every page in my web app.
It should look something like this:
I have the following HTML snippet:
<div class="alert alert-warning" role="alert">
<i class="glyphicon glyphicon-warning-sign warnicon"></i>
Upcoming maintenance from #Model.MaintenanceBegin to #Model.MaintenanceEnd.
</div>
Of course I don't want to manually add this snippet to every page, that's why I considered using a _layout.cshtml which could be included in every view. The problem is that I already have a bunch of _layouts (for different purposes) and I don't want to add it in those files manually as well (as far as I know it's not possible to nest layout files).
Question:
Is there any suggestion how I could solve this problem? Or is there any better approach to this kind of problem?
I thought about using an ActionFilterAttribute which could intercept requests and append the messages to the response, but then I would have the overhead for each request.

asp.net MVC bootstrap button click event?

I am new to asp.net, razor and bootstrap and very familiar with winforms and older code.
I am trying to understand one thing: button click event in MVC?
MVC has no design view, no properties view to go right to the events. I have been trying to understand the relationship between jquery, c# and a button in a view, where does the logic live? i have created functions, tried to set a debug breakpoint, says code will never get here...
The other examples seem to be that while c# has a single onbutton click() event; in the mvc there could be several files that must line up with no intellisense to make sure its got the right handler???
You are confusing client-side JavaScript with server-side C#.
In WebForms, you create a "OnClick" event that gets called on the server, but there is no such thing in MVC. The only "onclick" is a javascript client-side event that can only do things in javascript in the browser (or make ajax calls to the server).
Button clicks, if they are set as "submit" buttons trigger form posts, which call Action Methods on the server, these are not events. They are just your MVC action methods.
So the short answer is.. there is no "OnClick" event that calls a Server side handler.

SEO With Angular and ASP.NET MVC (not SPA)

I have an hybrid architecture using ASP.NET MVC and AngularJS.
I use ASP.NET MVC for routing so I have not a single page application.
I inject my C# ViewModel into angular controller using init() method like this in my ASP View :
#model AddictLive.Core.ViewModel.Mobile.ViewModels.MovieViewModel
#using Newtonsoft.Json
<div ng-controller="MovieController" ng-init="init(#Html.Raw(JsonConvert.SerializeObject(Model)))">
...
</div>
To get my ViewModel in my Angular controller I use :
$scope.init = function (movieViewModel) {
$scope.property1= movieViewModel.property1;
$scope.property2= movieViewModel.property2;
};
In this context I met an SEO problematic because pages content's are loaded dynamically by Angular even if my ViewModel is load server side.
When google bot scan my page all variables are always here ({{variable}} or ng-repeat="movie in movies").
All solutions I have found on the web are based on the hashtag #! for single page application but my website it not a single page application.
I have found a solution for {{variable}} like this using :
<span ng-bind="variable">#Model.myVariable</span>
but I have problem for ng-repeat and ng-include because I can't use razor #Model.
I have read that all content under an hidden div is not a good practice for google seo so it is not an option too.
Does anyone know a solution to my problem?
Thanks
I have no direct solution for you but an advice. I learned that it iis hardly possible to create sites that are good for users and search engines. Topics like ajax and on-demand-loading are for users and bad for search engines and also the other way around. e.g. so many pages have texts for search engine only that are so boring for users.
I recommend to make separate landing pages with nice urls. At the top of the landing page you do something to increase your conversion, e.g. play a search button or whatever and below you place content for search engines. Then make your user-pages invisble for google with:
<meta name="robots" content="nofollow,noindex" />
Create two different pages: One for your user and one for the search engine. This guarantees that you do not have to do any compromises.

jQueryMobile Data Binding options

I was going through some basic tutorial on jQueryMobile and would like to know -
what are the different databinding options available for jQueryMobile?
I searched and as a result found only knockoutjs -
Is it the only way to go or can I bind the controls like we generally do for normal html controls?
Essentially, I want to use jQueryMobile with MVC 4 and bind the controls with JSON.
Please guide.
You should be able to treat a jquery mobile site built with MVC just as you do any other MVC application. You may run into issues with jqm based ajax navigation but that can be turned off with data-ajax="false".
http://jquerymobile.com/test/docs/forms/forms-sample.html
You can also make this change globally: "jQuery Mobile will automatically handle link clicks and form submissions through Ajax, when possible. If false, URL hash listening will be disabled as well, and URLs will load as ordinary HTTP requests."
$(document).bind("mobileinit", function(){
$.mobile.ajaxEnabled = false;
});
http://jquerymobile.com/test/docs/api/globalconfig.html
In the end, ajax based navigation is about performance. If you want to go with generic asp.net MVC, you will have to weigh these trade offs.

asp.net mvc: handling no-javascript

I'm working on a asp.net mvc2 app. I have been using jquery to do various different things in all of my views. They are work from a regular browser quite well. But I'm trying to figure out a good way to get the functionality working with browsers with javascript disabled (like mobile browsers). Is there a way to define a whole different view for non javascript browsers?
A specific example of what I'm trying to do is, I have a <button> with it's onClick calling a javascript that does $.post() to a controller.
What's a good way to make it, so, it works the way it works right now (doing ajax calls) with regular javascript-enabled browsers and it a also works with javascript-incapable browsers, doing a full postback ?
Thanks
I use the unobtrusive javascript approach; get the app working without JavaScript, then add in extensibility with JQuery so that the app will work when scripts are turned off, or if the JS fails to download.
Same approach I believe that #James Kolpack is talking about. This is the true failsafe approach. While you can detect the support of JS by the browser through Request.Browser, this isn't accurate to most of the possible scenarios.

Resources