Where to put jQuery code for DOM manipulation in Codeigniter - codeigniter

I have some jQuery code that deals with DOM manipulation, simple stuff like fadeIn(), etc...
Is the best practice to put
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
and any script associated with manipulating the HTML on a CI view right on the view.php file?
Thanks

That's eminently reasonable. If you're using jQuery you should probably wrap your manipulation code in a ready call.

Related

Add js code to create layout in controller in magento

I am creating a blocks in my controller using
$this->_addContent($this->getLayout()->createBlock('mymodule/mymodule_newpage')
Is there any way how I can embed js code into the addcontent function. I dont want to add complete js but a chunk of code.
Thanks
You can add that particular js file in your static block (mymodule/mymodule_newpage) by writing it under content tab.
<script type="text/javascript" src="http://your_site.com/js/your_js_file.js"></script>
Though I am not 100% sure.Give a try.Goodluck.
You can try:
$this->_addContent($this->getLayout()->createBlock('core/text')->setText('your script here'));
Obs: I could not make sintax highlight fpr PHP work anymore...

Why does form validation not work in MVC3 partial views?

Anybody? There is another question regarding this but the only answers were to code up some javascript validation, which also refuses to work on my partial view ("$ is not defined").
Anyway, I don't want to use javascript I just want simple validation for required fields that cannot be left blank, number fields that require ints, etc.
Can anyone shed some light on validation and partial views?
I suspect that you are loading those partial views using AJAX. If this is the case you will need to manually invoke the $.validator.unobtrusive.parse method once you inject the new contents of the partial into the DOM as explained in this article.
Brad Wilson also discussed this in his blog post:
The unobtrusive client validation script automatically parses the
initial set of HTML for validation rules when the page has finished
loading. If your page dynamically adds new HTML content (perhaps
throught Ajax or through client-side application code), you may wish
to parse that new HTML for client validation on the new HTML elements.
To parse new HTML, you can call the
jQuery.validator.unobtrusive.parse() method, passing it a selector for
the HTML that you would like to be parsed. You can also call the
jQuery.validator.unobtrusive.parseElement() function to parse a single
HTML element.
As far as the $ is not defined error you should make sure that you have included the proper scripts:
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
Also make sure you are not referencing any of the Microsoft*.js scripts. They are obsolete and should no longer be used in ASP.NET MVC 3.
Of course that's only a supposition, you haven't shown any code so we cannot know what you are doing.
I'm having the same problem and i found that it's not possible to call $.validator.unobtrusive.parse() on the same form twice.
When loading the form initially from the server the form is parsed automatically by the unobtrusive library. When you add an input element dynamically to the form and call $.validator.unobtrusive.parse() again, it won't work. The same goes for parseElement().
So before you call $.validator.unobtrusive.parse, remove the original validator and unobtrusive validation from the form like so:
success: function (html) {
$("#div-id").append(html);
var form = $("#div-id").closest("form");
form.removeData('validator');
form.removeData('unobtrusiveValidation');
$.validator.unobtrusive.parse($("#editorRows"));
}

dojo.xhrGet(): how to execute inline javascript?

simple question: How do I execute inline javascript in a HTML page snippet loaded with dojo.xhrGet()?
Being new to dojo I'm a bit confused this doesn't just work like in JQuery ...
Can anyone help??
Thanks,
thomas
We need more details! If you don't provide enough info you'll never get the right answer.
Anyway, if the HTML snippet is loaded inside a ContentPane, use a dojox.layout.ContentPane (is an extension to dijit.layout.ContentPane providing script execution).Or you could use one of the script tags that dojo accept. E.g:
<div dojoType=...>
<script type="dojo/connect" event="functionToConnectTo">
//javascript here
</script>
</div>
More valuable information about script tags on dojo parser reference.

Unexpected result loading partial view into an IE8 DOM using jQuery Ajax

I have a strange result happening when loading a Partial View using jQuery Ajax into the DOM, but only when viewing the result using IE8.
The Partial View in question (for example purposes only) looks like this;
<aside>Example test</aside>
When the result comes back from the Ajax call it appears to look exactly as above. However when viewing the DOM using the developer tools in IE8 the result looks like this;
<aisde/>
Example test
</aside/>
As a result the element is not recognised and the text does not sit within it. Also the style sheet class for 'aside' is not being applied. This only happens in IE8 as far as I can see.
Any one got any suggestions, other than do not use custom tags?
Thanks in advance
You need to make sure the DOM recognizes HTML5 elements. Essentially you will have to do:
document.createElement('aisde');
Have a look at this link. Without creating the element older IE browsers will not see or style the elements.
The common practice around these issues is to load a html5 fix javascript file within a conditional comment block. The script does a createElement on all new html5 node types.
<!--[if lte IE 8]>
<script src="html5.js" type="text/javascript"></script>
<![endif]-->

jQuery .NoConflict Script Load

I am trying to use jQuery in a highly conflict environment. .noConflict() doesn't work and I am trying to do something like
<script type="text/javascript">
document.write( document.write(unescape("%3Cscript src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));
jQuery.noConflict();
var $ = jQuery;
</script>
Any ideas how to fix this ?
Are you sure it has nothing to do with the fact that you have:
document.write( document.write(unescape(...longstringhere...)); // Missing final close paren?
That would cause an error and then noConflict wouldn't work.
Also, do you need to be using Prototype and jQuery at the same time? The whole purpose of jQuery.noConflict() is to NOT set the jQuery variable to $ because Prototype uses it (I'm sure there are other reasons, but that's the main one in this case). jQuery and Prototype aren't good friends, usually.
Finally, are you absolutely positive (assuming you don't have the syntax error in your real code) that jQuery is getting loaded?
Did some quick research. Check this link and see if it helps any:
http://docs.jquery.com/Using_jQuery_with_Other_Libraries
Basically, you might have to call jQuery first, and you will have to call Prototype BEFORE you use noConflict()
Don't use $ - that is the source of the conflicts. Substitute jQuery wherever you'd normally use it, like so:
jQuery('#my-id')
jQuery('.my-class')
and so on

Resources