I'm posting this question not because I am getting some errors but because I would like to know how dajax should be used
Here is what I want to do:
I want some links on my homepage (eg. books, authors), when user clicks them, he gets a list of books/authors.
Here is what I'm doing:
When user clicks on books, I call a dajax process.
Inside ajax.py:
I get all the books using books = Book.objects.all()
I have a template = "{% for book in books %}"... blah blah blah
I render the template a = Template(template).render(Context(locals()))
I do dajax assign a as innerhtml of some div tag.
Is this the right way to do things?
Instead of writing the template in ajax.py should I open templates from some xyz.html and then render it? Any other good, clean ways to get similar tasks done?
I never heard about dajax before (but it looks like the project has gone sightly inactive as the latest commit is ~10 months old), so I'll offer advice that is not directly related to dajax.
Basically, what you need to do is to display a list that is retrieved using AJAX. That's pretty trivial using the following tools:
jQuery (or another JS framework)
JSON
What you need to do is:
Configure one of your views so that it returns a list of books (look here for the documentation)
Access this view using your JS framewok of choice (jQuery.get() for jQUery)
Using your JS framework, update some <ul> or <ol> on your page by adding the content that you retrieved through your get call (And you could place it in some overlay that you'd display).
Loading a template from a dedicated template file is in almost any case cleaner. A long python string with HTML in it is not very readable.
Of course you could also send your books via add_data(data,callback_function) and write a javascript callback function that populates the list which would be the Dajax way of doing what Thomas Orozco proposed.
But judging from the pagination example rendering a template file and sending it to innerHTML is 'the right way'.
Related
I guess this question has already been posted in different forms over time, but I still didn't find the answer I'm looking for:
I'm having trouble implementing vueJS in my Laravel app, I want to keep server and front-end very much separated but in this case it doesn't seem so easy. I have the classic blog project, where every article has some tags associated with it, so there's a classic many-to-many relationship and everything is set.
When I edit an article, I wanna have a section where all the tags are displayed and also you can add a new tag (very stackoverflow-like), what I wanna achieve is that my Javascript (and so my vue) only manages the rendering of those tags on the page, so that when I enter in the edit page I can see all associated tags, BUT, i only want to edit the input tag inside my form, I don't want to do a POST request in Vue, I want to keep it PHP, I want laravel validation, I don't want to write another one for the javascript.
I want javascript to only edit the DOM when I want to add a tag, so that I insert a new one and it immediately gets pushed inside the already existing array of tags, so in real-time the tags are updated, but when I submit the form it is my PHP that handles the server request, not vue, and this for now seems impossible because in order to update the tags correctly when adding one (or removing one), the data inside vue needs to have a list of tags, otherwise it won't work.
This means I have to create a new route (for example /tags/{article_id}) and a new controller function in order to return tags associated with that article, so this also means that I can't give to PHP the tags that I rendered (cause for example they're in a list, not an input select (due to the appearence I want to give)) isn't there a cleaner way to do this?
I'm trying to wrap my head around vuejs but sometimes it feels like stuff would be easier in jQuery (?), I don't know... I hope I explained myself correctly.
I tried to update my campaign html content using mailchimp api:
/campaigns/{campaign_id}/content
You can find more information about this api here: https://developer.mailchimp.com/documentation/mailchimp/reference/campaigns/content/#
Before sending a campaign, I tried to get campaign content html, modified it and then set campaign content html using above api. I just simply use BeautifulSoup to append a new tag to content body:
content.body.append(BeautifulSoup('<p>Mailchimp is freaking shittttt</p>'))
Then, some interesting things happen, the first campaign I created, it works fine, the tag added appears in my email. But, then the sub-sequence campaigns not working anymore, the tag added not appearing.
I observed something strange on my mailchimp campaign site, even though I set campaign html content, only Plain-Text Email gets changed (HTML Source still the old version) for both working and not working campaign.
Anyone got this issue before?
I had a similar issue and I had to take a slightly different approach to solve it. According to this answer by Joel H., "MailChimp doesn't allow updating the campaign's HTML content because the campaign type is based on a template. In order to update the HTML content, the campaign has to be set to custom HTML instead of a template."
That solution didn't suit me but it led me to another solution: creating a template, creating editable content areas within that template, and then using the API to retrieve and edit the text in those content areas.
Here is an attempt at adapting my code to solve your problem. I'm using Python 3 and the mailchimp3 client.
default_footer_content = client.templates.default_content.all(template_id=TEMPLATE_ID)['sections']['SECTION_NAME']
new_footer_content = default_footer_content.replace(PLACEHOLDER, 'Mailchimp is freaking shittttt')
client.campaigns.content.update(campaign_id=CAMPAIGN_ID, data={'template': {'id': TEMPLATE_ID, 'sections': {'SECTION_NAME': new_footer_contennt}}})
Some pointers on the above code:
You can find TEMPLATE_ID with the API or simply by copying the numbers at the end of the URL when editing the template in the web interface
You define SECTION_NAME by placing 'mc:edit="SECTION NAME"' in the appropriate place in the template
I've used .replace() rather than .append() so you will need to put PLACEHOLDER or similar at the appropriate place in the template
I hope that helps, happy to modify my answer if it needs more clarification. This is my first answer on Stack Overflow so constructive criticism appreciated :)
I'm using LocomotiveCMS on a project and I have some doubts on what's the best approach when dealing with ajax requests to the same site.
I have a Content Type for a model called reviews. There can be plenty of review entries, so I'd like to show 20 per time, then allow fetching other 20s by hitting a button (like a 'load more' button).
What is the best approach for this? I was thinking on making a custom API controller in order to do that. It would have to find the right type of content entries based on the content type for reviews. Then add some regular javascript that hits that controller and add the new set of reviews based on a mustache template. Does it make sense or is there something that LocomotiveCMS has in order to accomplish such type of tasks?
Update:
I got an answer from the LocomotiveCMS google group. Basically somebody suggested to create a liquid template that looks like a json. For the full answer go to https://groups.google.com/forum/#!msg/locomotivecms/vJKDtl81v7E/IEwOR9hhLjMJ
i've been posting alot questions lately on stackoverflow due to my issues i'm facing recently and you guyz have realy helped me alot.
MY Question:
I'm working on backbone.js and i've worked on codeignitor on my project. Now my question is in ci, i can load views directly from ci view and can display dynamic html easily ( working fine for me). problem is i've to shift my js code and functions and ajax calls to backbone.js and i'm pretty much at the start of this project. i'm not clear on how can i show entirely new page html on some events in backbone.
my question Not clear? let me explain further.
Explanation:
i mean i've some an index page and all of things load in this page ( sliders , footers etc etc ). whenever any item is clicked to see the details, ci calls the appropriate methods and gives me the html which displays that product in an entirely new page ( without loading ) with only image of that product and some other options for the product. it's pretty easy with ci, but how can i do this with backbone.js to show up different pages or entirely different html from index page and not showing other stuff of index page.
i can work out how to move and design the logic behind it but i'm not getting the picture of how can i load these different html for different events ( like about button should show about us page, featured category should show featured products all in that main index file.)
I'm really desperate to get some directions.
thnx guyz
I think you were meant to say you want to make single page application.
Yes, backbone best idea to do so. You will required following :
template ( should be inside <script type="text/template"> and </script>)
backbone view
backbone model
backbone router
I'm trying to find tutorials or code to allow users to customise their page, just like twitter ,wordpress and tumblr do.
Could someone tell me what technology their using?
i'm a .net developer, but maybe they're using jquery?
Any help would be great.
Thanks
You can use javascript to change style sheets and the DOM
Question is a bit broad. To change the page you simply need to manipulate the DOM or change the CSS associated with the page's elements. This can be done any number of ways. E.g. you could write out a new CSS class dynamically, you could add new elements to the DOM itself or you could modify the existing attributes of the page. e.g. to set the background of the page you can do something like:
(assuming JQuery)
$("body").css('background-image','url(path/to/image)');
Hope that helps,
-fs