Creating ajax application without rendering JSON - ruby-on-rails-3

Sorry for my English - I am from Russia.
I am a beginner Ruby on Rails 3 developer. I have to make ajax in my application, updating only part of html content. I can't use jQuery load function with neсessary element, because server generates content of all page and I need only part. Now I render json and generate html from it on the client using jQuery, but it is dirty and wrong. Creating pages with bit of HTML only for ajax in my opinion is dirty too. How can I solve my problem more beautiful? Thanks.

Hope this help
http://ruby-on-rails-tutorials.blogspot.com/2010/11/rails3-ajax-tricks-with-javascript-erb.html

Related

Using ViewComponents in RTE

I am trying to use ViewComponents tag helpers in CKEditor to show some products but it doesn't.
I created a vc tag helper like this :
<vc:products html-class="col-12 col-md-5" html-style="" skip="0" take="10"></vc:products>
Now I am trying to use this code in CKEditor, I mean post editors can call products anywhere they want. but it doesn't work. CKEditor shows it as a html code.
what should I do?
This code will be actually executed on the server side and it will add partial html to your page then the server will return it to the client.
<vc:products html-class="col-12 col-md-5" html-style="" skip="0" take="10"></vc:products>
Here I'm not sure what you are trying to accomplish, but you cannot dynamically use tag helpers on the client side. May be this link can help you.
Dynamically Produce Razor Views at Runtime?

How to render a jade block(section) using links?

I was hoping someone had any insight on this basic approach. Sample scenario:
I have a dashboard template with menu links a(href "/page") and I want to click the links to render a different section/view on the template. I used block content...but does it need a specific route?
If I understand correctly, you want to update the content of the page on click of the link without the page getting refreshed.
In that case, no you can't do it using block content.
The purpose of block content is to apply inheritance in your templates.
The typical use of block content would be creating a layout and then creating more specific page from the layout. This is what the official documentation says.
The reason why you cannot do it because, jade is server side templating library. This resolves the block content on server. Once rendered in client, the html looses all the information that was specific to jade (which is obvious because its an html afterall).
What you can do here is
Create a /page.jade and make a ajax call to a service. That service should return an already compiled html string. Since you are using jade, you can easily use jade.compile(source, options) to template / generate html.
Jade API documentation here

How to sync 2 Elements (2 different pages) via Pusher

Is it possible to sync the innerHTML of 2 divs (or any other HTML element or ASP.net control) via Pusher?
My 1st page has an div that I use to insert iframes to PDFs/other files via jquery. I am trying to find a way to also push that data to a div on another page, so that clients can see what files are being displayed.
Please excuse me if this is a naive question - I am new to Javascript and Websocket.
I am building my site via ASP.NET MVC4, if that makes a difference.
Thank you
It's probably not a good idea to send the actual HTML code over Pusher as that can turn out to be quite a lot of data. Have you considered sending the URL for the iframes to each connected client so they can synchronise and load up the same page?

ASP.NET MVC 4 changing contents of div without reloading

I'm new to web development and ASP.NET MVC 4
My question is: Is it possible to replace the content of div tag without needing to refresh the whole page?
If so, what is the best practice of it (best use of MVC 4)?
In order to refresh partial content of a page, you have to use AJAX. There are plenty of resources available online describing how to implement this in ASP.NET MVC. One of the possibilities is using partial views, on which you can find a good tutorial here. However, if you're comfortable with javascript/jQuery a partial view might be overkill if you're just looking to update one div.
Use javascript and make an ajax call. MVC has a JsonResult for the controller you can use if you like.
Not 100% sure but if I remember right, jQuery is bundled with MVC4. Correct me if I'm wrong.
// Javascript code
$('#mydiv').load('/Content/html/mySnippet.html');
Would replace the contents of a <div id="mydiv"></div> with the contents of the /Content/html/mySnippet.html.
You can also call an action and return a partial view if you wish to have dynamic content instead of a static html template.

Jquery Form Validation NOT USING model Annotations

I have tried asking this question in a number of ways, and I still can't get an answer. In Asp.net MVC4, is there a way I can just add jquery code to my views and not have to add any kind of annotation to a model to validate my form input? I just realized that I am using Ajax.BeginForm... I am betting that I cannot using regular Jquery Ajax calls with that on my form. I bet if I use HTML.beginForm, regular jquery will work. But now that will break my ajax calls... Which were failing for some reason. Well, I am about to find out why. Hopefully I can figure out how to just avoid using all Asp.net Ajax crap. It has given me nothing but a massive headache. Oh wait, you know what, I just looked at another view, and there I am using Html.BeginForm and I still can't use plain jquery code in my views to validate my form. Is this even possible in MVC4?
of course this is possible - ASP.NET MVC just emits HTML yes? so just add some jquery validate code to the document ready.
$(function(){
$('#myform').validate(/* options here */);
});