[basumrinmoyParticipant]

I follow same procedure as you show example . I am using 2.8.3 version. But problem remains.

[basumrinmoyParticipant]

Ok its working ! Thanx for your suggestion.

[basumrinmoyParticipant]

I am using jqwidget’s existing theme for grid. So how can I define css class name like ‘yellowCell’.

[basumrinmoyParticipant]

No Sorry I can’t upgrade now. I want this in version jQWidgets v2.7.0 (2013-Feb-08). So please give me solution for this version.

[basumrinmoyParticipant]

This is my code using version 2.7.1 but I have facing same issue still now. I am sending you the demo code .

<link rel="stylesheet" href="../../Scripts/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="../../scripts/gettheme.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxdropdownlist.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var theme = getDemoTheme();
        var source = [
                    "Affogato",
                    "Americano",
                    "Bicerin",
                    "Breve",
                    "Café Bombón",
                    "Café au lait",
                    "Caffé Corretto",
                    "Café Crema",
                    "Caffé Latte",
                    "Caffé macchiato",
                    "Café mélange",
                    "Coffee milk",
                    "Cafe mocha",
                    "Cappuccino",
                    "Carajillo",
                    "Cortado",
                    "Cuban espresso",
                    "Espresso",
                    "Eiskaffee",
                    "The Flat White",
                    "Frappuccino",
                    "Galao",
                    "Greek frappé coffee",
                    "Iced Coffee",
                    "Indian filter coffee",
                    "Instant coffee",
                    "Irish coffee",
                    "Liqueur coffee"
		        ];
        // Create a jqxDropDownList
        $("#jqxWidget").jqxDropDownList({ source: source, selectedIndex: 1, width: '200', height: '25', theme: theme });
        $("#jqxWidget2").jqxDropDownList({ source: source, selectedIndex: 1, width: '200', height: '25', theme: theme });
    });
</script>
<input type="text" tabindex="1" />
<div tabindex="2" id='jqxWidget'>
</div>
<input type="text" tabindex="3" />
<div tabindex="4" id='jqxWidget2'>
</div>

[basumrinmoyParticipant]

sorry i am using 2.7.1

[basumrinmoyParticipant]

I am using latest version.

[basumrinmoyParticipant]

As you previously suggest me to set tab index for Dropdownlist its working. But when there is also other controls in a page then its not properly work. Actual problem is in a page if control position like
1st is Dropdownlist (tabindex :1)
2nd is Textbox and (tabindex :2)
3rd is again Dropdownlist (tabindex :3)

then tabindex skip from 1st dropdownlist to 2nd dropdown. Please help me to resolve this problem.

[basumrinmoyParticipant]

Thanks Its working.

[basumrinmoyParticipant]

Please help me I already send you the sample Code which demonstrates it.

@{
ViewBag.Title = “Home Page”;
}

<script type="text/javascript">
    $(document).ready(function () {
        var theme = getDemoTheme();
        $('#dtDOB').jqxDateTimeInput({ width: '200px', height: '25px', theme: theme });
        $("#Accounteditform").jqxWindow({ height: 420, width: 850, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.30 });
        $("#openit").click(function () {
            $("#Accounteditform").jqxWindow('show');
            //$("#jqxgrid").jqxGrid('exportdata', 'json', 'jqxGrid');
        });
    });
</script>

<div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
    <div id="jqxgrid">
    </div>
    <div style='margin-top: 20px;'>
      
        <div style='margin-left: 10px; float: left;'>
           
            <input type="button" value="Open" id='openit' />
        </div>
    </div>
</div>
<div id="Accounteditform">
    <div>
        <table border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                    Date
                </td>
                <td>
                    <div id="dtDOB">
                    </div>
                </td>
            </tr>
        </table>
    </div>
</div>

[basumrinmoyParticipant]

My Script:

<link rel="stylesheet" href="../../Scripts/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="../../scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../../Scripts/gettheme.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxdatetimeinput.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxcalendar.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxtooltip.js"></script>
<script type="text/javascript" src="../../Scripts/jqwidgets/jqxwindow.js"></script>
<script src="../../Scripts/jqwidgets/globalization/globalize.js" type="text/javascript"></script>
<script src="../../Scripts/jqwidgets/globalization/jquery.global.js" type="text/javascript"></script>
@{
    ViewBag.Title = "Home Page";
}
<script type="text/javascript">
    $(document).ready(function () {
        var theme = getDemoTheme();
        $('#dtDOB').jqxDateTimeInput({ width: '200px', height: '25px', theme: theme });
        $("#Accounteditform").jqxWindow({ height: 420, width: 850, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.30 });
        $("#openit").click(function () {
            $("#Accounteditform").jqxWindow('show');
            //$("#jqxgrid").jqxGrid('exportdata', 'json', 'jqxGrid');
        });
    });
</script>

[basumrinmoyParticipant]

my html designl design

<div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
    <div id="jqxgrid">
    </div>
    <div style='margin-top: 20px;'>
      
        <div style='margin-left: 10px; float: left;'>
           
            <input type="button" value="Open" id='openit' />
        </div>
    </div>
</div>
<div id="Accounteditform">
    <div>
        <table border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                    Date
                </td>
                <td>
                    <div id="dtDOB">
                    </div>
                </td>
            </tr>
        </table>
    </div>
</div>

[basumrinmoyParticipant]

DateTimeInput opens in IE 7.0 . Actual issue I have found – I have several forms open using jqxWindow and in those forms DateTime Calender not open in IE 7.0 otherwise if the DateTimeInput is inside jqxExpandar or not opens.

[basumrinmoyParticipant]

Is it working in all version of IE ?

[basumrinmoyParticipant]

Is it workin in all version of IE ?

[Author]

Posts