I have created a custom asp.net 2.0 web part and deployed in on a SharePoint 2007 page. In this web part i have an SpMenuFiled menu. The menu items are implemented using MenuItemTemplate. The web part also has a Button and a TextBox. On the click of the menu item I am adding some text to the TextBox.

 Thus (menu click)--------js----->>(fire server button click)------------------->>(put text in TextBox)

The Button click is done through inline javascript of the MenuItemField.

My problem is when I add this Web Part two times to the same page, clicking on both the menus (in diff web parts) fire only the button in the first Web Part.

I noticed that click of MenuItemTemplate is handled by a Core.JS function. Only after this my javascript gets executed. The following is the inline JS i am using

string jsString = "document.getElementById('" + btnAddRemove.ClientID + "').click();";
MenuItem1.ClientOnClickScript = jsString;

By using the clientID i am trying to ensure that the button in the same web part is clicked. But this does not seem to work

Looking into the HTML source of the page I found that the rendering is done properly. Thus the Core.js function which come inbetween is spoiling the show.

Please help me with a workaround.

Thanks in advance

 The code looks like this.

using System;
using System.Runtime.InteropServices;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Serialization;
using System.Data;

using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using Microsoft.SharePoint.WebPartPages;

namespace SPMenuList
{
    [Guid("985d966a-f97f-481d-891d-ee13b9776037")]
    public class SPMenuList : System.Web.UI.WebControls.WebParts.WebPart
    {
        
        private SPGridView oGrid;
        private DataSet oDataset;
        private DataView oView;
        Button btnAddRemove;
        TextBox lbl1; MenuItemTemplate MenuItem1;
        
        public SPMenuList()
        {
            this.ExportMode = WebPartExportMode.All;
        }

        private void PopulateDataSet()
        {

            oDataset = new DataSet("MenuDataSet");
            DataTable dt = oDataset.Tables.Add("MenuDataTable");
            dt.Columns.Add("MenuType", typeof(string));
            DataRow dr1 = dt.NewRow();
            dr1["MenuType"] = "Type1";
            dt.Rows.Add(dr1);


        }
        protected override void CreateChildControls()
        {
            lbl1 = new TextBox();
            btnAddRemove = new Button();
            btnAddRemove.Text = "clicked from Menu";
            btnAddRemove.ID = "ButtonAddRemove";
            btnAddRemove.Click += new EventHandler(btnAddRemove_Click);

            PopulateDataSet();
            oView = new DataView(oDataset.Tables["MenuDataTable"]);

            oGrid = new SPGridView();
            oGrid.GridLines = GridLines.Both;
            
            oGrid.DataSource = oView;
            oGrid.AutoGenerateColumns = false;

            BoundField colName = new BoundField();
            colName.DataField = "MenuType";
            colName.HeaderText = "MenuType";
            oGrid.Columns.Add(colName);
            Controls.Add(oGrid);
            oGrid.DataBind();

            colName.Visible = false;

            SPMenuField colMenu = new SPMenuField();
            colMenu.HeaderText = "MenuType";
            colMenu.TextFields = "MenuType";
            colMenu.MenuTemplateId = "MenuListMenu";
            colMenu.SortExpression = "MenuType";

            MenuTemplate MenuListMenu = new MenuTemplate();
            MenuListMenu.ID = "MenuListMenu";
            MenuItem1 = new MenuItemTemplate("MenuItem1");
           
            MenuListMenu.Controls.Add(MenuItem1);   

            Controls.Add(MenuListMenu);
            oGrid.Columns.Add(colMenu);
            Controls.Add(btnAddRemove);
            Controls.Add(new LiteralControl(">>>"));
            Controls.Add(lbl1);
            oGrid.DataBind();

            base.CreateChildControls();
        }
        protected override void OnPreRender(EventArgs e)
        {
            string jsString = "document.getElementById('" + btnAddRemove.ClientID + "').click();";
            MenuItem1.ClientOnClickScript = jsString;
        }
        protected override void Render(HtmlTextWriter writer)
        {

            base.Render(writer);
        }
        void btnAddRemove_Click(object sender, EventArgs e)
        {
            
            lbl1.Text = "hello";
            
        }

        }
    }

Hi,

I'm not sure what the problem is here but this may work:

MenuItem1.Attributes.Add("onclick", jsString);

Regards,
Sasa

I forgot to say that instead of "MenuItem1.ClientOnClickScript = jsString;" you should try using "MenuItem1.Attributes.Add("onclick", jsString);"

I hope it will work.

Thanks a lot Sasa. Using the attributes.add puts my javascript function before the js function in CORE.JS.

The MenuItemTemplate is behaving odd again.

I tried  what Sasa said.

string jsString = "document.getElementById('" + btnAddRemove.ClientID + "').click();";
menuitem.Attributes.Add("onclick", jsString);

Unlike all the other controls in which I have had used the attributes.add method, in the case of MenuItemTemplate the apostrophes used in jsString comes as ' in the HTML source. This results in not matching of the ClientID and the implementation fails. For Controls like TextBoxes the apostrophe remains the normal way in HTML viewsource.

Help

prasvi:

Thanks a lot Sasa. Using the attributes.add puts my javascript function before the js function in CORE.JS.

I'm sorry but I didn't understand if my answer helped you?

Using the solution I posted before you don't need core.js at all and it doesn't matter when core.js is included.

Sasa I thought that getting the custom js function to be called before the js function in CORE.JS would solve my problem. Following your suggestion I am able to do that.

MenuItem1.ClientOnClickScript = jsString; would add an attribute called OnMenuClick to the MenuItemTemplate while MenuItem1.Attributes.Add("onclick", jsString); would add onclick attribute.

The problem now is that i am unable to check the full functionality as the apstrophes in the jsString  comes as its ascii value in the HTML source. This makes the document.getElementByID consider the string argument as a var and raises a javascript error. Have never had this problem with any other control.