How to show aspxpopup control on button click instead of enter key press

Steps:
==== 
1. I have two textboxes  and one button and one aspxpopupcontrol in a aspxwebpage
2. I attached  Keypress event for two textboxes and i have attached button OnClientClick event from C#     code behind to show aspxpopupcontrol.
3. Here problem is when ever i enter some data in any one of the text and press enter it is executing           textbox keypress event as well as it showing aspxpopupcontrol. it is very annoying to the user.
4. I resolved this issue by using the following devexpress client side method  in textbox keypress event.
                       ASPxClientUtils.PreventEventAndBubble(e.htmlEvent);

 Example:
========

  <dx:ASPxTextBox runat="server" ID="txtSearch" ClientInstanceName="txtSearch" NullText="Search by Text"  Style="border-radius: 4px 4px 4px 4px;">
  <ClientSideEvents  KeyPress="function(s,e){ 
                                                                var keypressed=ASPxClientUtils.GetKeyCode(e.htmlEvent);
                                                                if(keypressed ==13)
                                                                  { 
                                                                        //Your client side functionality goes here
                                                                        ASPxClientUtils.PreventEventAndBubble(e.htmlEvent);
                                                                  }}" />
  </dx:ASPxTextBox> 

<dx:ASPxTextBox runat="server" ID="txtTagSearch" ClientInstanceName="txtTagSearch" NullText="Search by Tag"  Style="border-radius: 4px 4px 4px 4px;">
  <ClientSideEvents  KeyPress="function(s,e){ 
                                                                var keypressed=ASPxClientUtils.GetKeyCode(e.htmlEvent);
                                                                if(keypressed ==13)
                                                                  { 
                                                                        //Your client side functionality goes here
                                                                        ASPxClientUtils.PreventEventAndBubble(e.htmlEvent);
                                                                  }}" />
  </dx:ASPxTextBox> 

 <asp:ImageButton ID="btnShowCustomViewBuilder" CausesValidation="true" runat="server" ImageUrl="~/Styles/Images/FilterIcon.png"
                                                         OnClientClick=" popup.Show();  return false"    />

<dx:ASPxPopupControl ID="AspxPopupControl1" runat="server" Modal="True" AutoUpdatePosition="true" HeaderStyle-Font-Bold="true"
    PopupHorizontalAlign="WindowCenter" PopupVerticalAlign="WindowCenter" AllowDragging="true" AccessibilityCompliant="false" 
    ShowLoadingPanel="false" HeaderText="Example Popup" ClientInstanceName="popup"  PopupAction="LeftMouseClick" 
    Width="520px">
    <ContentCollection>
        <dx:PopupControlContentControl ID="PopupControlContentControl3" runat="server" SupportsDisabledAttribute="True">

<table>

<tr>

<td> //Your content goes here  </td>

</tr>

</table>

  </dx:PopupControlContentControl>
    </ContentCollection>
</dx:ASPxPopupControl>


Reference to resolve above issue

How filter Date Column data in Devexpress XPO XPDataView

public string GetCreatedDate(string period, string column, string customFilterFrom = null, string                CustomFilterTo = null)
        {

            string date = string.Empty; string filterexp = string.Empty;
            DateTime dt = DateTime.Today;
            switch (period.ToUpper())
            {

                case "CUSTOM":
                    date = new BetweenOperator(column, Convert.ToDateTime(customFilterFrom.Replace("/", "-                                  ")),       Convert.ToDateTime(CustomFilterTo.Replace("/", "-"))).ToString();

                    break;
                case "TODAY":
                    date = new BetweenOperator(column, dt, dt.AddDays(1)).ToString(); //string.Format("[{1}]                                    = #{0}#", dt, column);//.ToString("MM/dd/yyyy")
                    break;
                case "LASTDAY":
                     date = new BetweenOperator(column,dt.AddDays(-1),dt).ToString();
                    break;
                case "THISYEAR":
                    date = new BetweenOperator(column, new DateTime(DateTime.Now.Year, 4, 1),                                                      dt.AddDays(1)).ToString();
                    break;

                case "THISMONTH":
                    date = new BetweenOperator(column, new DateTime(DateTime.Now.Year,                                                             DateTime.Now.Month, 1), dt.AddDays(1)).ToString();
                    break;
                case "LASTMONTH":
                    date = new BetweenOperator(column, new DateTime(DateTime.Now.Year,                                                            DateTime.Now.Month, 1).AddMonths(-1), new DateTime(DateTime.Today.Year,                                          DateTime.Today.Month, 1).AddDays(-1)).ToString();
             
                    break;
                case "THISWEEK":
                    int days = (DateTime.Now.DayOfWeek - DayOfWeek.Sunday) - 1;
                    DateTime thisweek = DateTime.Now.AddDays(-(days));
                    date = new BetweenOperator(column, thisweek, thisweek.AddDays(days)).ToString();
                    break;
                case "LASTWEEK":
                    int diff = (DateTime.Now.DayOfWeek - DayOfWeek.Sunday) + 6;
                    DateTime mondayOfLastWeek = DateTime.Now.AddDays(-diff);
                    date = new BetweenOperator(column, mondayOfLastWeek,                                                                                 mondayOfLastWeek.AddDays(diff -6)).ToString();
                     break;
                default:
                    date = string.Format("[{0}] = '{1}'", column, period);
                    break;

            }
            return date;
        }

Refer my original post in devexpress : Unable to filter date values in xpo DataSource

How to calculate quarters in sql

Here are a few uses of the DATEADD date function:

Usage #1 : Get the Date Part of a DATETIME Value

SELECT DATEADD(DD, DATEDIFF(DD, 0, GETDATE()), 0) AS [Date Part Only]

Usage #2 : Get the First Day of the Month, Quarter and Year

SELECT DATEADD(MM, DATEDIFF(MM, 0, GETDATE()), 0) AS [First Day of the Month]
SELECT DATEADD(Q, DATEDIFF(Q, 0, GETDATE()), 0) AS [First Day of the Quarter]
SELECT DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()), 0) AS [First Day of the Year]

Usage #3 : Get the Last Day of the Month, Quarter and Year

SELECT DATEADD(MM, DATEDIFF(MM, 0, GETDATE()) + 1, 0) - 1 AS [Last Day of the Month]
SELECT DATEADD(Q, DATEDIFF(Q, 0, GETDATE()) + 1, 0) - 1 AS [Last Day of the Quarter]
SELECT DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()) + 1, 0) - 1 AS [Last Day of the Year]

Usage #4 : Get the First Day of the Following Month, Quarter and Year

SELECT DATEADD(MM, DATEDIFF(MM, 0, GETDATE()) + 1, 0) AS [First Day of Next Month]
SELECT DATEADD(Q, DATEDIFF(Q, 0, GETDATE()) + 1, 0) AS [First Day of Next Quarter]
SELECT DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()) + 1, 0) AS [First Day of Next Year]

Usage #5 : Get the Last Day of the Following Month, Quarter and Year

SELECT DATEADD(MM, DATEDIFF(MM, 0, GETDATE()) + 2, 0) - 1 AS [Last Day of Next Month]
SELECT DATEADD(Q, DATEDIFF(Q, 0, GETDATE()) + 2, 0) - 1 AS [Last Day of Next Quarter]
SELECT DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()) + 2, 0) - 1 AS [Last Day of Next Year]

Usage #6 : Get the First Day of the Previous Month, Quarter and Year

SELECT DATEADD(MM, DATEDIFF(MM, 0, GETDATE()) - 1, 0) AS [First Day Of Previous Month]
SELECT DATEADD(Q, DATEDIFF(Q, 0, GETDATE()) - 1, 0) AS [First Day Of Previous Quarter]
SELECT DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()) - 1, 0) AS [First Day Of Previous Year]

Usage #7 : Get the Last Day of the Previous Month, Quarter and Year

SELECT DATEADD(MM, DATEDIFF(MM, 0, GETDATE()), 0) - 1 AS [Last Day of Previous Month]
SELECT DATEADD(Q, DATEDIFF(Q, 0, GETDATE()), 0) - 1 AS [Last Day of Previous Quarter]
SELECT DATEADD(YEAR, DATEDIFF(YEAR, 0, GETDATE()), 0) - 1 AS [Last Day of Previous Year]

Source: SQL Server Helper

DECLARE @mydate DATETIME

SELECT @mydate = GETDATE()

SELECT CONVERT(VARCHAR(25),DATEADD(dd,-(DAY(@mydate)),@mydate),101) ,

'Last Day of Previous Month'

UNION

SELECT CONVERT(VARCHAR(25),DATEADD(dd,-(DAY(@mydate)-1),@mydate),101) AS Date_Value,

'First Day of Current Month' AS Date_Type

UNION

SELECT CONVERT(VARCHAR(25),@mydate,101) AS Date_Value, 'Today' AS Date_Type

UNION

SELECT CONVERT(VARCHAR(25),DATEADD(dd,-(DAY(DATEADD(mm,1,@mydate))),DATEADD(mm,1,@mydate)),101) ,

'Last Day of Current Month'

UNION

SELECT CONVERT(VARCHAR(25),DATEADD(dd,-(DAY(DATEADD(mm,1,@mydate))-1),DATEADD(mm,1,@mydate)),101) ,

'First Day of Next Month'

--------------------------------------------------------------------------------------------------

----TodaySELECT GETDATE() 'Today'
----YesterdaySELECT DATEADD(d,-1,GETDATE()) 'Yesterday'
----First Day of Current WeekSELECT DATEADD(wk,DATEDIFF(wk,0,GETDATE()),0) 'First Day of Current Week'
----Last Day of Current WeekSELECT DATEADD(wk,DATEDIFF(wk,0,GETDATE()),6) 'Last Day of Current Week'
----First Day of Last WeekSELECT DATEADD(wk,DATEDIFF(wk,7,GETDATE()),0) 'First Day of Last Week'
----Last Day of Last WeekSELECT DATEADD(wk,DATEDIFF(wk,7,GETDATE()),6) 'Last Day of Last Week'
----First Day of Current MonthSELECT DATEADD(mm,DATEDIFF(mm,0,GETDATE()),0) 'First Day of Current Month'
----Last Day of Current MonthSELECT DATEADD(ms,- 3,DATEADD(mm,0,DATEADD(mm,DATEDIFF(mm,0,GETDATE())+1,0))) 'Last Day of Current Month'
----First Day of Last MonthSELECT DATEADD(mm,-1,DATEADD(mm,DATEDIFF(mm,0,GETDATE()),0)) 'First Day of Last Month'
----Last Day of Last MonthSELECT DATEADD(ms,-3,DATEADD(mm,0,DATEADD(mm,DATEDIFF(mm,0,GETDATE()),0))) 'Last Day of Last Month'
----First Day of Current YearSELECT DATEADD(yy,DATEDIFF(yy,0,GETDATE()),0) 'First Day of Current Year'
----Last Day of Current YearSELECT DATEADD(ms,-3,DATEADD(yy,0,DATEADD(yy,DATEDIFF(yy,0,GETDATE())+1,0))) 'Last Day of Current Year'
----First Day of Last YearSELECT DATEADD(yy,-1,DATEADD(yy,DATEDIFF(yy,0,GETDATE()),0)) 'First Day of Last Year'
----Last Day of Last YearSELECT DATEADD(ms,-3,DATEADD(yy,0,DATEADD(yy,DATEDIFF(yy,0,GETDATE()),0))) 'Last Day of Last Year'




Source: Kreato Crm

How to inspect HTML elements in the browser

Internet explorer

Check whether the Developer Toolbar is installed on your machine. If you are using IE8+, this tool is already integrated in your browser. Otherwise, you need to install it manually. If the Developer Tool is installed, perform the following steps:

1. Execute Developer Toolbar by pressing the F12 key on your keyboard. Alternatively, click the Tools -> F12 Developer tools menu as shown below.

2. The Developer Tools window will be displayed;

3. Click the Select element button;

4. Click an element on the page;

5. A corresponding HTML element will be selected in the HTML window;

6. Now we know that the CSS rule with the “testRule” name is applied to the element;
7. Find this rule in the Style window as shown below:

Firefox

The Firebug add-on is used for this purpose. Check whether this tool is installed on your machine and perform the following steps:

1. Execute Firebug by pressing the F12 key on your keyboard. Alternatively, click the Tools -> Web Developer -> Firebug -> Open Firebug menu as shown below.

2. The Firebug window will be displayed;

3. Click the button that is shown below to inspect a corresponding element;

4. Click the element on the page;

5. A corresponding HTML element will be selected in the HTML window;

6. Determine the rule name as shown above;
7. Find this rule in the Style window as shown below:

Chrome

Use Developer Tools to accomplish this task.
1. Execute Developer Tools by pressing the F12 key on your keyboard. Alternatively, click the Menu -> Tools -> Developer tools menu as shown below.

2. The Developer Tools window will be displayed;

3. Click the button that is shown below to inspect a corresponding element;

4. Click the element on the page;

5. A corresponding HTML element will be selected in the HTML window;

6. Determine the rule name as shown above;
7. Find this rule in the Style window as shown below:

Opera

Use the Opera Dragonfly tool.
1. Execute the Opera Dragonfly tool by pressing the Ctrl+Shift+I key combination on your keyboard. Alternatively, click the Menu -> Page -> Developer Tools -> Opera Dragonfly menu as shown below.

2. The Opera Dragonfly tool window will be displayed;

3. Check whether the following buttons are pressed as shown below:

4. Click the element on the page;

5. A corresponding HTML element will be selected in the HTML window;

6. Determine the rule name as shown above;
7. Find this rule in the Style window as shown below:

Safari

1. Click the Safari settings -> Preferences... menu as shown below.

2. In the Settings window click the Advanced tab and enable the Show Develop menu in menu bar option as shown below.

3. Close the Settings window and click the Menu for current page -> Develop -> Show Web Inspector menu.

The remaining steps are the same as for Google Chrome.

Source: How to inspect CSS rules

AspxComboxbox Client Side Events and Client Side Properties

1. How to get the Text of combobox in clientside javascript

===========================================================

Aspx Page Code

===============

<dx :ASPxComboBox ID="cmbExample1" ClientInstanceName="cmbExample" runat="server">

</dx: ASPxComboBox>

<asp:button Id="btnTest" Text="Show Text" OnClientClick="ShowComboText(); return false;" runat="server" >

Note: here "cmbExample" is the clientinstance name of the combobox control.

Javascript:

===========

function ShowComboText()

{ 

    var comboText= cmbExample.GetText(); 

  alert(comboText); 

}  

2. How to get the value of the combobox in clientside javascript

================================================================

 <asp:button Id="btnTest" Text="Show Value" OnClientClick="ShowComboValue(); return false;" runat="server" >

Note: here "cmbExample" is the clientinstance name of the combobox control.

Javascript:

===========

function ShowComboValue()

{ 

    var comboval= cmbExample.GetValue(); 

   alert(comboval);  

}  

                                    

3. How to find the item from combobox in clientside javascript

================================================================

 <asp:button Id="btnTest" Text="Show Item" OnClientClick="ShowFoundedItemByVal(); return false;" runat="server" >

Note: here "cmbExample" is the clientinstance name of the combobox control.

Javascript:

===========

function ShowFoundedItemByVal()

{  

    var comboitem= cmbExample.FindItemByValue('your value');

  alert(comboitem);  

}  

function ShowFoundedItemByText()

{ 

      var comboitem= cmbExample.FindItemByText('your value'); 

    alert(comboitem);   

}  

                                

4. How to remove from combobox in clientside javascript

================================================================

 <asp:button Id="btnTest" Text="Remove Item" OnClientClick="RemoveItem(); return false;" runat="server" >

Note: here "cmbExample" is the clientinstance name of the combobox control.

Javascript:

===========

function RemoveItem()

{ 

    var comboitem= cmbExample.FindItemByValue('your value'); 

 if (comboitem != undefined && comboitem != null) 

  {

         cmbExample.RemoveItem(comboitem.index);

          

   }

}