MonoX support board

Start the conversation, ask questions and share tips and solutions with fellow developers.

Non-registered users can only browse through our support boards. Please register now if you want to post your questions. It takes a second and it is completely free. Alternatively, you can log in without registration using your credentials at major sites such as Google, Microsoft Live, OpenId, Facebook, LinkedIn or Yahoo.

Web Parts and Javascript  (Mono Support )

Viewed 11668 time(s), 3 post(s) 9/15/2014 5:16:23 PMby Samtg
Samtg

Samtg

9/15/2014 5:16:23 PM
Hi,
     I can add javascript to pages to an extent, but for some reason it does not work all the time.  How for example, do you add javascript to a web part?
Here is what I want to add, it includes html (example, if I were to add this to the RSS Reader):

    <link rel="stylesheet" type="text/css" href="http://xoxco.com/projects/code/tagsinput/jquery.tagsinput.css" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://xoxco.com/projects/code/tagsinput/jquery.tagsinput.js"></script>
    <!-- To test using the original jQuery.autocomplete, uncomment the following -->
    <!--
    <script type='text/javascript' src='http://xoxco.com/x/tagsinput/jquery-autocomplete/jquery.autocomplete.min.js'></script>
    <link rel="stylesheet" type="text/css" href="http://xoxco.com/x/tagsinput/jquery-autocomplete/jquery.autocomplete.css" />
    -->
    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js'></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/start/jquery-ui.css" />
<script runat="server" type="text/javascript">
    
        function onAddTag(tag) {
            alert("Added a tag: " + tag);
        }
        function onRemoveTag(tag) {
            alert("Removed a tag: " + tag);
        }
        
        function onChangeTag(input,tag) {
            alert("Changed a tag: " + tag);
        }
        
        $(function() {

            $('#tags_1').tagsInput({width:'auto'});
            $('#tags_2').tagsInput({
                width: 'auto',
                onChange: function(elem, elem_tags)
                {
                    var languages = ['php','ruby','javascript'];
                    $('.tag', elem_tags).each(function()
                    {
                        if($(this).text().search(new RegExp('\\b(' + languages.join('|') + ')\\b')) >= 0)
                            $(this).css('background-color', 'yellow');
                    });
                }
            });
            $('#tags_3').tagsInput({
                width: 'auto',

                //autocomplete_url:'test/fake_plaintext_endpoint.html' //jquery.autocomplete (not jquery ui)
                autocomplete_url:'test/fake_json_endpoint.html' // jquery ui autocomplete requires a json endpoint
            });
            

// Uncomment this line to see the callback functions in action
//            $('input.tags').tagsInput({onAddTag:onAddTag,onRemoveTag:onRemoveTag,onChange: onChangeTag});        

// Uncomment this line to see an input with no interface for adding new tags.
//            $('input.tags').tagsInput({interactive:false});
        });
    
    </script>
        <form>
            <p><label>Defaults:</label>
            <input id="tags_1" type="text" class="tags" value="foo,bar,baz,roffle" /></p>
            
            <p><label>Technologies: (Programming languages in yellow)</label>
            <input id="tags_2" type="text" class="tags" value="php,ios,javascript,ruby,android,kindle" /></p>
            
            <p><label>Autocomplete:</label>
            <input id='tags_3' type='text' class='tags'></p>
            
        </form>

        
        
This content has not been rated yet. 
440 Reputation 38 Total posts
imarusic

imarusic

9/16/2014 6:32:09 AM
Hi,

what do you mean that JS is sometimes wokring and then not. Are you referring to callback inside of the update panel? Can you post screenshot of the console when in a c ase when your Js is not working?

Regards.
This content has not been rated yet. 
3016 Reputation 428 Total posts
Samtg

Samtg

9/22/2014 3:46:51 PM
Okay, I think I figured it out;  I put the code in a tag it wouldn't work in.

Thanks.
This content has not been rated yet. 
440 Reputation 38 Total posts