Moving button positions on a page

Page 1 of 1

2 Replies - 800 Views - Last Post: 26 November 2012 - 03:59 AM

#1 TheAKB  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 0
  • View blog
  • Posts: 54
  • Joined: 11-November 08

Moving button positions on a page

Posted 22 November 2012 - 05:58 AM

Ok Firstly the reason that i need to use javascript to do this is because the positions of the button in the "FunkeyContentPlaceHolder" is set in the ASNA monarch framework and after hours of manually changing the HTML code realised that it was a waste of time and have now been told that using javascript should force them to change.

So i have written my bit of javascript which i think is correct feel free to tell me if not and then went to insert into the page that i so wish like this.


   <script language="javascript" type ="text/javascript" >
        var els = document.getElementsByTagName('*');
        var PageUp;
        var PageDown;

        for (var i = 0, j = els.length; i < j; i++) {
            var s = els[i].id
            if (s != '') {
                if (s.indexOf("ctl00$FunkeyContentPlaceHolder$SU0001DControl_PageUp") != -1) {
                    PageUp = els[i]
                }
                if (s.indexOf("ctl00$FunkeyContentPlaceHolder$SU0001DControl_PageDown") != -1) {
                    PageDown = els[i]
                }

                if (PageDown != null & !PageUp != null) {
                    PageDown.parentNode.insertBefore(PageUp, PageDown.nextSibling);
                    break;
                }
            }
        }
    </script>


but after running the website and it not working i checked the source code and it all points back to a MasterPage.master which looks a bit like this before i touch it.

<%@ Master Language="AVR" AutoEventWireup="true" CodeFile="MasterPage.master.vr" Inherits="Merret.Web.MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <!-- Enter handler -->
    <%-- <script src="/scripts/jquery-1.3.2.min.js" ></script>--%>
     <script src="../scripts/jquery-1.6.2.js"></script>
	<script src="../scripts/external/jquery.bgiframe-2.1.2.js"></script>
	<script src="../scripts/ui/jquery.ui.core.js"></script>
	<script src="../scripts/ui/jquery.ui.widget.js"></script>
	<script src="../scripts/ui/jquery.ui.mouse.js"></script>
	<script src="../scripts/ui/jquery.ui.button.js"></script>
	<script src="../scripts/ui/jquery.ui.draggable.js"></script>
	<script src="../scripts/ui/jquery.ui.position.js"></script>
	<script src="../scripts/ui/jquery.ui.resizable.js"></script>
	<script src="../scripts/ui/jquery.ui.dialog.js"></script>
        <script type="text/javascript">

            }   

            $(function ShowPrintDialog() {
                $("#myPrintsDiv").dialog("open");
                $("#myPrintsDiv").dialog({
                modal: true,
                    height: 550, width: 750,
                    autoOpen: false, resizable: true, 
                    buttons: {
                        Ok: function() {
                            $(this).dialog("close");
                        }
                    }
                });
            });

            $(function ShowJDialog() {
                $("#dialog-message").dialog({
                    modal: true,   
                    autoOpen: false, resizable:false,
                    buttons: {
                        Ok: function() {
                            $(this).dialog("close");
                        }
                    }
                });
            });


so i can see that the javascript here all start with function so i try and add that to my code and insert it in here like so:

<%@ Master Language="AVR" AutoEventWireup="true" CodeFile="MasterPage.master.vr" Inherits="Merret.Web.MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <!-- Enter handler -->
    <%-- <script src="/scripts/jquery-1.3.2.min.js" ></script>--%>
     <script src="../scripts/jquery-1.6.2.js"></script>
	<script src="../scripts/external/jquery.bgiframe-2.1.2.js"></script>
	<script src="../scripts/ui/jquery.ui.core.js"></script>
	<script src="../scripts/ui/jquery.ui.widget.js"></script>
	<script src="../scripts/ui/jquery.ui.mouse.js"></script>
	<script src="../scripts/ui/jquery.ui.button.js"></script>
	<script src="../scripts/ui/jquery.ui.draggable.js"></script>
	<script src="../scripts/ui/jquery.ui.position.js"></script>
	<script src="../scripts/ui/jquery.ui.resizable.js"></script>
	<script src="../scripts/ui/jquery.ui.dialog.js"></script>
        <script type="text/javascript">

            function movebutton(s) {
                var els = document.getElementsByTagName('*');
                var PageUp;
                var PageDown;

                for (var i = 0, j = els.length; i < j; i++) {
                    var s = els[i].id
                    if (s != '') {
                        if (s.indexOf("ctl00$FunkeyContentPlaceHolder$SU0001DControl_PageUp") != -1) {
                            PageUp = els[i]
                        }
                        if (s.indexOf("ctl00$FunkeyContentPlaceHolder$SU0001DControl_PageDown") != -1) {
                            PageDown = els[i]
                        }

                        if (PageDown != null & !PageUp != null) {
                            PageDown.parentNode.insertBefore(PageUp, PageDown.nextSibling);
                            break;
                        }
                    }
                }
            }   

            $(function ShowPrintDialog() {
                $("#myPrintsDiv").dialog("open");
                $("#myPrintsDiv").dialog({
                modal: true,
                    height: 550, width: 750,
                    autoOpen: false, resizable: true, 
                    buttons: {
                        Ok: function() {
                            $(this).dialog("close");
                        }
                    }
                });
            });

            $(function ShowJDialog() {
                $("#dialog-message").dialog({
                    modal: true,   
                    autoOpen: false, resizable:false,
                    buttons: {
                        Ok: function() {
                            $(this).dialog("close");
                        }
                    }
                });
            });


and now by right clicking and viewing source i can see my code but my page up still sits before my page down button.

am i putting my JS in the wrong place or is the JS wrong or both?

Thanks in Advance

Is This A Good Question/Topic? 0
  • +

Replies To: Moving button positions on a page

#2 Kruithne  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 87
  • View blog
  • Posts: 411
  • Joined: 28-July 09

Re: Moving button positions on a page

Posted 23 November 2012 - 02:41 AM

Hello there,

First of all, I may be wrong, but you don't seem to have a working understanding of Javascript. Perhaps it would be an idea to learn it before trying to manipulate an already built up framework with small snippets? Just a suggestion.

Anyway, regarding the issue, you have not actually shown us what the issue is. You've told us it's something to do with some buttons somewhere, however I cannot actually see any point where these buttons exist in the above code!

Can you please post ALLrelative code for your issue to help us help you.
Was This Post Helpful? 0
  • +
  • -

#3 TheAKB  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 0
  • View blog
  • Posts: 54
  • Joined: 11-November 08

Re: Moving button positions on a page

Posted 26 November 2012 - 03:59 AM

Firstly i agree this would be an advantage if i had more understanding of Javascript, unfortunately i dont have that choice at the moment.

There is no code that can be seen for the buttons as they are all built into the Monarch Framework (ASNA) i don't really understand let alone trying to explain. But the issue above was the ID's of button are different in the version we have so i had to change it to .endsWith
Was This Post Helpful? 0
  • +
  • -
Page 1 of 1