Ajax load to only load one of multiple classes on page - javascript

So on my page i have many blog posts that are all editable on the page.
When you click edit a text editor is displayed and then on clicking save the editor goes away and the original text comes back.
However, i want the text of the original post to reload to show the new information.
This:
$targetForm.find('.divid').load('page.php .divid');
Works fine if there is only one div on the page, but if there is more than one all of the posts get loaded into the currently editing div.
How can i do the same sort of thing as $targetForm.find but for the div to update?
So like:
$targetForm.find('.divid').load('page.php $targetForm.find('.divid')')
That sort of thing.
Thanks.

try to handle the click event first before updating the div :
$targetForm.find('.divid').on('click', function(){
$(this).load('page.php .divid');
});

Related

Use Jquery load method unlimited times for a like button?

I am programming something like a tinder picture which you vote on ( but not for dating but the same concept). I want this Voting window, or rather said div, to refresh after you clicked the for example like button. But not the whole page because of the cashed images in the browser and the ugly static look when you post data via php post method and have to refresh the whole page. I did structure it like this now:
$('#indexMiddleLayout').load('rateableWindow.php');
The above line comes before in the script tag so the content gets loaded to begin with and the next code line comes after to make it possible to reload again when a sertain button is clicked.
$('#iML-VotingButtonRight').click(function () {
$('#indexMiddleLayout').load('rateableWindow.php');
});
This refreshes my div now but only once :/
I was putting the whole div and it's containing stuff into a seperate php file which i, after you clicked the like button, want to refresh with a ajax request which adds data to the sql database telling it has been liked and after that success i'd like the div or rather the included page to reload so only that div refreshes.

Creating DIV on Button Click with input DATA and IMAGE like facebook

I'm doing a project that consists of posting updates with photos, like facebook timeline. so i created this
So i need the code for the following:
When the POST button is clicked, make a new DIV on the top of last post on the timeline that is similar to facebook. and the DIV must consist of Input text and the image that i uploaded. when I browsed this topic I found similar thread jQuery create and remove <div> by click , but it creates divs one after another. I need just the opposite of that.
Any help will much appreciated.
Use prepend instead of append to put a new div on the beginning of a container:
http://api.jquery.com/prepend/
I suggest you to create a empty div were you want them to appear (id: #start) and everytime you whant to post something, you can use jQuerys after (eg:$("#start").after('<div>text and formating</div>');).You can see some more examples here: http://api.jquery.com/after/

Social buttons and changing attributes using EmberJS

I'm trying to have two social buttons (facebook & twitter) on my website using EmberJS. I'm binding the URL of those buttons to an attribute url (for example).
The problem is that the attribute url is changing, and the buttons are not reloading.
I did a spin-off of this article on the EmberJS: http://emberjs.com/guides/cookbook/helpers_and_components/creating_reusable_social_share_buttons/
Updated to the last EmberJS version (1.3.1), and added a "change text" button. Try changing the text for the text button, and you'll see that the button is not reloading.
Link to the jsbin: http://emberjs.jsbin.com/izOtIYi/1/edit (watch the console too)
I think it's because Twitter is messing with the Metamorph system. How can I bypass this? I'm sure someone faced this before.
The strangest thing is that it's working well with facebook like button.
Thanks !
The issue is that when you load the twitter widget it parses the <a> and then replaces it with an <iframe>. So even when you update the text property it doesnt reload the button.
One way to work around it would be to rerender the view when the text changes this would cause the iframe to be removed and a new a tag to be added.
I fixed up the jsbin to update the button when the text changes http://emberjs.jsbin.com/izOtIYi/8/edit
I got put the logic which rerenders the button into the component to make it more reusable.
The button will flash whenever the text is changed because its actually removing the existing button and creating a new button each time the text changes.

Coming back on a page with the same quicktab and fields expanded (items do not remain expanded)

I have a website with Drupal 7. On one page, we have two quicktabs (using quicktabs module), under each quicktab we have expendable fields. Those fields are expandables thanks to this code:
jQuery(".ideas-content").hide();
jQuery(".ideas-title").click(function () {
jQuery(this).toggleClass('ideas-closed').toggleClass('ideas-open').next(".ideas-content").toggle();
});
The user can click links inside these expandable fields to go to another inside page. When the user goes to the previous page (the page with these expandable fields), quicktabs are back to default and the fields the user previously expanded are not expanded anymore.
How can I do to have the user coming back on the page with the right quicktab and fields expanded? I was thinking to create anchor links but I do not know more.
I googled the issue with no success.
Thank you for any input and help.
If you are able to access the exact HTML of your page, through template.php function overrides, .tpl.php overrides, or by writing the HTML yourself within the page.tpl, you can add IDs and classes around the elements you want, and then since you are using javascript, you can try using a library such as https://github.com/browserstate/history.js in order to get functionality to take the user back to the state they were in -- with open sections -- after going to another page.

Livecycle remove first page

I have a LiveCycle form in Designer that has a flowable menu page with checkboxes. When a checkbox is checked, certain pages are 'shown' in the document. The pages are subforms containing an image.
This functionality works fine. What I want to do is add a button to the front page that will remove the front page, open a 'saveas' window and then close. I can get the saveas and the close function to work but the front page gets cleared and is left blank in the document. If there is nothing on the page then surely it should realise it is not required as per the workflow?
Any workarounds would be greatly appreciated, this has been doing my head in for weeks! I know I can't delete the page using the acrobat model as there aren't the correct permissions. I'm hoping a bit of javascript on the button will do the trick.
At the moment I have:
this.resolveNode ("indexSub").presence = "hidden"; //indexSub is the subform
app.execMenuItem("SaveAs");
app.execMenuItem("Close");
I will look at forcing a filename at save another time!
Thanks
It is quite strange behaviour. I've checked that you can set presence either to invisible or inactive and it works fine then.
this.resolveNode ("indexSub").presence = "invisible"; // or "inactive"
Differences between invisible and inactive you can fnd here: http://blogs.adobe.com/formfeed/2009/03/xfa_30_presenceinactive.html
Actually "inactive" did play a part in the solution, not entirely sure if it was intentional!
The main change was to alter the first page from flowable to positioned. When the button was pressed, the page cleared, the SaveAs dialogue opened and then the document closed. When the saved document was reopened the menu page had disappeared as required. I'll add a comment to this if anything changes. Thanks all.

Categories

Resources