I am a newbie to javascript functioning and wanted to see its functioning regarding pasting dynamic data in the html.
I have this link where they tell what to use for the same in a table but I can't figure out how to do the same...
The link to the code is javascript link
I first made an html page using the html shown and then added the lines of javascript shown below it in <SCRIPT LANGUAGE="JavaScript"> tag.
But I am not getting the same output.... What am i doing wrong ?
Please help...
It seems like the example you're trying to imitate is doing client-side data binding. First of all, yes, you need to reference jQuery script in your page. Secondly, you'd be better off accomplishing client-side data binding with the jQuery Templates plugin.
Related
I need to fire this javascript function:
window.icegram.get_message_by_id(2072).show();
From a plain URL (e.g. www.google.com/? etc) as I cannot edit the HTML, as shown in this image:
I have tried to use this code in that URL field:
javascript:window.icegram.get_message_by_id(2072).show();
But when I click on the button, it says "Uncaught TypeError" and that the function is unknown.
For reference purposes, the Icegram documentation says that you can trigger the popup by using either using (both work on a Wordpress post):
Your text
OR
[icegram campaigns="XXXX"]Your Text [/icegram]
Maybe I could call the javascript function by including it in a separate file first? I would appreciate any help, I have tried and researched for a couple hours.
I can confirm that it adds the javascript section in the correct place -
does this mean that there is an issue with my javascript function, perhaps its not working properly? Confusing as it does work on a wordpress post (when using the full "a href=" code) but when I use the function it instantly says -
Alright, it seems that Icegram has a bug, in which the function ID used in the shortcode (e.g. 2072) is different from the function ID needed when calling using javascript (wtf), which in this case was 2073.
So if anyone else needs it, this is the solution for a plain URL field:
javascript:icegram.get_message_by_id(2073).show();
which results in the following output when viewed live on the frontend:
Your Anchor Text
I hope that helps someone. A big thank you to mplungjan and sabithpocker for the guidance and responses.
I need to be able to extract, manipulate and update the text in wordpress's tinymce #content textbox.The code is coded in a wordpress plugin.
The below post helps but i am unable to comment or contact the original creator to ask him further questions. Having 1 points I cant practically do anything except ask questions. Let me know if i am doing this wrong.
Basically the code from this link is what i need to manipulate or edit the content in wordpress tinymce editor.
Manipulating TinyMCE content with jQuery
But the code seems to be overly simplified.
so my question is:
Do i need to include jquery
Do i need to include the tinymce js or class? is it in wordpress itself?
The code seems to be half javascript half php? Is the code suppose to be coded in a .js file?
do i need to put php tags here?
// make it into a jQuery object
var $content = $(content);
// manipulate the jquery object using jquery
$content = $content.remove('a');
Thanks.
hi I have figured it out after a bit more researching.
At first I was working with php to manipulate data after it is saved. But then i went on to wanting to manipulate the text before it was saved like underlining certain text based on a list in the database. So I needed to move on to javascript because i was editing the text before it was submitted or a page reload which i didn't wrap my head around yet.
So next i just coded the changes into javascript and built a button to call the process.
and seems i didn't need to include the tinymce class because probably the header of the editor page has already included it.
I am working on standalone JavaScript application which is being coded in HTML 5.
It has almost 50-60 html pages including repetitive markup such as header, footer and nav.
But if I have to make change in header then I have to make changes in 56-60 pages.
Is there any solution to use reusable html markup so if I did changes in one page it will reflect to other pages?
I can't even use php.
Prepare one javascript function. Write your html elements through javascript or jquery function. run it in page load event. and call the function in html by div.
Put this javascript function in separate .js file. And call this js file in wherever you want. And just place the div wherever you want in the html page.
See this jsfiddle DEMO
I Hope this demo will useful to you in this situation.
If you are using HTML (.html) pages and do not have Server-Side-Includes option then you can use a JavaScript template (which is not too difficult).
Second option : use of iframe.
Write the whole javascript code in common_layout.js
Add every statement using id of that div and add this file with main layout.
$( document ).ready(function() {
$('#header').html('<b>Header</b><ul><li>First Link</li><li>Second Link</li></ul> ');
});
UPDATE: One of my favorite post from TutsPlus : Best practices when working with JS Templates
If you are just started with this application. You can think of using client side java script frameworks like - AngularJS. It would be lot easier to maintain the code and solve such trivial issues.
You can use object tag like this:
<object name="header" type="text/html" data="header.html"></object>
i write some html with JS into a div.
like this
$("#picdiv").html("<a rel='lightbox' href='pic.jpg'><img src='htumb.jpg'></a>");
it is just an example.
So, i have in $(document).ready Funcktion this code.
$('a[rel=lightbox]').fancybox();
but if i click on the link, a get to the page with picture... i know the Problem must be, i write the html with js, but i have no other option. So haw can I make fancybox works?
This is due to how jQuery works. The fancybox function will only work for current elements on the page and not ones dynamically added by javascript.
A quick fix might be to be modify the code as follows:
$("#picdiv").append($("<a rel='lightbox' href='pic.jpg'><img src='htumb.jpg'></a>").fancybox());
Not sure if the above will work, but the general idea is to ensure that any new elements created have the plugin applied.
solution
$('.picture_display').find('a[rel=lightbox]').fancybox();
I want a JavaScript with which I can change the font dynamically when the page is live (Arial to Times). But when I click Arial or Times, the page should not get refreshed. Can anyone please help me in this? Or can anyone please provide a script for this?
You should do this with javascript, not php.
Use javascript to change the style of the text dynamically. Php is run on the server, and is therefor not in the picture for your no-reload scenario.
Example
Here is the first simple example google returned (e.g. search "javascript change text font" for more examples):
<html>
<body>
<div id=hey>
<a onMouseover="document.getElementById('hey').style.fontFamily='courier'"> Make me COURIER!</a> ----
<a onMouseover="document.getElementById('hey').style.fontFamily='verdana'"> Make me VERDANA!!!</a>
</div>
</body>
</html>
If you really want to use PHP and don't want the entire page to reload, you would need some form of AJAX implmentation.
However...your problem can be solved more easily with Javascript and I would recommend using that instead. The jQuery library allows you to change CSS styles with minimal code. There are a few code examples on changing style attributes on the jQuery website.