We Keep Coding

Change content on the fly

I am currently working in dynamic template creation where user can drag any defined element from source area into destination area. Now after dropping user can modify it's text (change / add new).
I have done dragging and dropping but how to change it's text after dropping. ?
Is there any javascript library available to help me out?

Have you taken look at the HTML contenteditable Attribute?
<div contenteditable="true">This div is editable. Try to change this text.</div>

Answer is simple. After dropping your element, change it's content to textarea which can be styled to look same as before dragged.
For question about library. I would use jQuery because of it's easy content manipulation. You do something like this:
function eventAfterDrop(container) {
container.html('<textarea name="textarea" class="same-as-dragged"></textarea>');
}
This will do only one thing and that's change of content to textarea. It can be done many different ways. I'm just trying to show you which way to go.
PS: If you show some code, someone can help you to do this exactly for your code.

CKeditor doesn't work properly

I have a problem. I added CKeditor to my website.
Now i have a problem. If i add lines:
<script>
CKEDITOR.replace( 'tresc' );
</script>
In head section on my main page everything works, but if i go to contact or panel page unfortunetly editor doesn't work(name of the textarea is the same). If i add this lines at the end of body section in contant or panel works, but in the main page only one textarea working with editor, rest doesn't. Writing website on includes(my index is not changing and everything in content div is including from other files). Can some1 help me?

Please see: https://docs.ckeditor.com/#!/guide/dev_installation-section-adding-ckeditor-to-your-page
The replace method has to be used below textarea tag.
Your textarea tags need to have unique id and/or name attributes. So that each CKEditor instance knows to which textarea it is assigned. Unique element id's are also a requirement in HTML.
If your textarea tags can't have different names (they can't have same id's), please drop the names and assign fake class to each e.g. 'myeditor' and use replaceAll method: CKEDITOR.replaceAll('myeditor');.

I solve my problem.
I've added class and use another <script></script>. Now everything is working. Thanks j.swiderski for helping me. Best regards.

Wordpress Search & Filter Autosubmit

I'm working with the Wordpress Search & Filter plugin and it's exactly what I needed for filtering though my gallery and shop content! I would like to make my selections submit every time a dropdown is changed, as opposed to having to click the submit button. (See link below).
In researching other posts, I've found that the solution is to implement this into my theme's java script file:
$(".searchandfilter select").change(function() {
$(".searchandfilter").submit();
});
I have put the line into my WooThemes Canvas's 'general.js' file but it seems to make no difference. I still need to click on the submit button to make changes. I've tried placing it in various other js files but I've had no luck. The page in questions is this one:
http://richardrosenman.com/wordpress/portfolio/
Does anyone have any insight as to what I'm doing wrong? I would REALLY appreciate any help as I'm stuck (and somewhat of a novice with Javascript!).
Thanks!

jQuery is loaded with jQuery.noConflict(); therefore you cannot use $ as selector (other libraries may be using it), instead use jQuery as selector:
jQuery(document).ready(function(){
jQuery(".searchandfilter select").change(function() {
jQuery(".searchandfilter").submit();
});
});
I think you can add it to general.js end of file since I see that file is loaded.

is it possible that by clicking, the class of the element change?

I want to put a switch for my website that when you click it the language of the page change. Yesterday I saw a close live example in a website.
Here's the link: http://iranfilm76.com/
The object on the left side in the header is exactly what I'm trying to achieve, but instead of changing the background i want to change the language.
I already have the functions for changing the language, my problem is the object, I download the image and css for the file.
I take a close look at the codes with firebug and when you click on the tag the class of the tag changes to class="changestyle".
How can I do this? Thanks for any suggestion.

YOUR_ELEMENT.addEventListener("click", function(){
this.classList.toggle("changestyle");
});
Demo: http://jsfiddle.net/DerekL/KpwkG/ | http://jsfiddle.net/WsGGa

For a non pure javascript approach, you can try selecting your toggle element using jquery like so:
$('element').click(function(){
$(this).toggleClass('language');
});
Then in your CSS you can apply whatever rules you want

I need examples for adding a throbber during page loads

Does someone have a code example of running an animated throbber during asp.net page loads? More than one example would be appreciated.

A throbber is generally just an animated .gif that holds the place of content. When the content is loaded, that image is hidden or removed from the dynamic element and replaced with the actual content (or vice versa if you're making a form or similar).
Here's a link to the Facebook "throbber" -
http://static.ak.fbcdn.net/rsrc.php/v1/zb/r/GsNJNwuI-UM.gif
Here's a link to a Wikipedia asset: https://upload.wikimedia.org/wikipedia/commons/d/de/Ajax-loader.gif
Matching article: https://en.wikipedia.org/wiki/Throbber
As you can see, it's an animated gif.
Update: If you're still using this for reference then please check out the CSS throbbers in various projects.

On http://ajaxload.info/ you can generate your own :)

You can use asp.net AJAX UpdateProgress control. Put your throbber image in the ProgressTemplate.
The issue with that is you will have to use UpdatePanel for that. If you are already using it nice.
Another options you might want to look into:
Use jQuery to show/hide your throbber.
jQuery UI's progressbar plugin.