Moving .css and .java to external files

[kwikstand]

My SEO guy says I should move as much java and css to external files as possible. In particular, these pieces of code:

Code: Select all

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
    theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>

Code: Select all

<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
if (typeof(ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
//]]>
</script>

Code: Select all

<script type="text/javascript">
    $(function () {
        $(".searchPhrase").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "Search.aspx/Suggest",
                    data: "{ 'term': '" + request.term + "' }",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    dataFilter: function (data) { return data; },
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return {
                                value: item
                            }
                        }))
                    }
                });
            },
            minLength: 2
        });
    });
</script>

Is it possible to do this? If so, how could it be accomplished?

Thanks,
Scott

[nadeem]

At minimum you can move the last script to external file. Other scripts seems embedded in code and built dynamically.

To move the last script in external file, first of all create a js file (e.g. simplesearch.js) inside Scripts folder at website root.

Now open ConLib/Utility/SimpleSearch.ascx and copy the following script to new created file:

Code: Select all

$(function () {
        $(".searchPhrase").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "Search.aspx/Suggest",
                    data: "{ 'term': '" + request.term + "' }",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    dataFilter: function (data) { return data; },
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return {
                                value: item
                            }
                        }))
                    }
                });
            },
            minLength: 2
        });
    });

After this, remove/comment all the above code including <script type="text/javascript"> and </script>

Now open ConLib/Utility/SimpleSearch.ascx.cs and add the following code:

Code: Select all

protected void Page_Load()
        {
            IncludeJS(this, "~/Scripts/simplesearch.js");
        }

        public static void IncludeJS(Control control, string jsfile)
        {
            HtmlGenericControl child = new HtmlGenericControl("script");
            child.Attributes.Add("type", "text/javascript");
            child.Attributes.Add("src", jsfile);
            control.Controls.Add(child);
        }

Similarly, you can move your inline CSS to external style sheet that is, App_themes/YOURTHEME/custom.css file.