Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
30
How to allow column value copy functionality
posted

In our ignite grid we have multiple selection is on and edit functionality is also availabel. But while editing any row user cannot copy the value from the cell. Currently we have upgraded the version from 13.2 to 19.2. In lower version this was working on internet explorer. but now it is not workin on either chrome or IT. 

Please help me to enable the copy functionality while edit is enable. also please find attached file with the grid html code

CopyPasteIssue.txt
 <!-- Ignite UI Required Combined CSS Files -->
<link href="~/IgniteUI/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
<link href="~/IgniteUI/css/structure/infragistics.css" rel="stylesheet" />
<script src="~/Scripts/modernizr-2.8.3.js"></script>

<script src="~/Scripts/jquery-1.11.3.min.js"></script>
<script src="~/Scripts/jquery-ui.min.js"></script>

<!-- Ignite UI Required Combined JavaScript Files -->
<script src="~/IgniteUI/js/infragistics.core.js"></script>
<script src="~/IgniteUI/js/infragistics.lob.js"></script>
<script src="~/IgniteUI/js/modules/infragistics.util.js"></script>
<script src="~/IgniteUI/js/modules/infragistics.datasource.js"></script>
<script src="~/IgniteUI/js/modules/infragistics.ui.shared.js"></script>
<script src="~/IgniteUI/js/modules/infragistics.ui.editors.js"></script>

<!-- Used to add modal loading indicator for igGrid -->
<script src="~/IgniteUI/grid-modal-loading-inicator.js"></script>

 @(Html.Infragistics()
                        .Grid(Model)
                        .ID("Grid")
                        .Height("600px")
                        .Width("1200px")
                        .AutoGenerateColumns(false)
                        .AutoGenerateLayouts(false)
                        .RenderCheckboxes(true)
                        .PrimaryKey("BreakID")
                        .FixedHeaders(false)
                        .Columns(column =>
                        {
                            column.For(x => x.SourceCode).HeaderText("Source").Width("70px");
                            column.For(x => x.ReasonCode).HeaderText("Reason").Width("70px");
                            column.For(x => x.Comments).HeaderText("Comment").Width("200px");


                            column.For().HeaderText().Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${IocCode}</div>{{else}}${IocCode}  {{/if}}"); ;
                            column.For().HeaderText("Transaction").Width("130px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${TransactionNumber}</div>{{else}}${TransactionNumber}{{/if}}"); ; ;
                            column.Unbound("Details").Template("<input type='button' onclick='showDetails(${BreakID})' value='Detail' class='btn btn-xs'/>").HeaderText("Details").Width("60px");
                            column.For(t).HeaderText("").Width("90px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Account}</div>{{else}}${Account}  {{/if}}"); ; ;

                            column.For().HeaderText("").Width("50px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Age}</div>{{else}}${Age}  {{/if}}"); ; ;
                            column.For().HeaderText("").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${CSD}</div>{{else}}${CSD}  {{/if}}"); ; ;
                            column.For().HeaderText("").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${ISIN}</div>{{else}}${ISIN}  {{/if}}"); ; ;
                            column.For().HeaderText("").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${TrnType}</div>{{else}}${TrnType}  {{/if}}"); ; ;

                            column.For().HeaderText("").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Location}</div>{{else}}${Location}  {{/if}}"); ; ;
                            column.For().HeaderText("Enter Date").Width("140px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${CREATED_TS}</div>{{else}}${CREATED_TS}  {{/if}}");

                            column.For().HeaderText("").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Checked}</div>{{else}}${Checked}  {{/if}}"); ; ;
                            column.For().HeaderText("Age>=30").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Age30DAYS}</div>{{else}}${Age30DAYS}  {{/if}}"); ; ;
                            column.For().HeaderText("High Risk ").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${HighRiskBIM}</div>{{else}}${HighRiskBIM}  {{/if}}"); ; ;
                            column.For().HeaderText("Medium Risk ").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${MediumRiskBIM}</div>{{else}}${MediumRiskBIM}  {{/if}}"); ; ;
                            column.For().HeaderText("Name").Width("150px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${ClientServiceManager}</div>{{else}}${ClientServiceManager}  {{/if}}"); ; ;
                            column.For().HeaderText("Multiple").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${MultipleUpdates}</div>{{else}}${MultipleUpdates}  {{/if}}"); ; ;
                            column.For().HeaderText("Verified").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${VerifiedIndicator}</div>{{else}}${VerifiedIndicator}  {{/if}}");
                            column.For().HeaderText("Break ID").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${BreakID}</div>{{else}}${BreakID}  {{/if}}"); ; ;
                        })
                        .Features(f => { f.Tooltips().Visibility(TooltipsVisibility.Always).ColumnSettings(settings => settings.ColumnSetting().ColumnKey("Comments").AllowTooltips(true)).ShowDelay(100); })
                        .Features(feature =>
                        {
                            feature.Updating().ColumnSettings(cs =>
                            {

                                cs.ColumnSetting().ColumnKey("Details").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("BreakID").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("IocCode").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("ClientServiceManager").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("CREATED_TS").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("TransactionNumber").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("TrnType").ReadOnly(true);

                                cs.ColumnSetting().ColumnKey("Location").ReadOnly(true);

                                cs.ColumnSetting().ColumnKey("MultipleUpdates").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("Account").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("Age").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("Age30DAYS").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("HighRiskBIM").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("MediumRiskBIM").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("Checked").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("VerifiedIndicator").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("CSD").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("ISIN").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("SourceCode").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("ReasonCode").ReadOnly(true);
                                cs.ColumnSetting().ColumnKey("Comments").ReadOnly(true);



                            }).EnableAddRow(false).EnableDeleteRow(false);
                            feature.Sorting();
                            feature.Resizing();
                            feature.Paging().PageSize(50);
                            feature.Filtering().Mode(FilterMode.Simple);


                        })
                        .DataSourceUrl(Url.Action("GetFreeOfPayment"))
                        .UpdateUrl(Url.Action("FreeOfPaymentSaveData"))
                        .DataBind()
                        .Render()
    )
}

  • 485
    Offline posted

    Hello Niranjan,

     

    Thank you for posting in our forum.

     

    Since I want to be sure I understand your question correctly, some additional information regarding your scenario would be much appreciated:

     

    1. By “upgraded the version from 13.2 to 19.2” I guess you actually mean either version 19.1 or 18.2? Which one of the two are you using at the moment?
    2. All columns have been set as “ReadOnly” in the Updating feature settings in the provided configuration. That means you could copy the value of a given cell, but you would not be able to paste it into another. Is that the problem that you have, or you cannot copy the value of a cell at all? If you have a problem with pasting the copied value into another cell, removing the ReadOnly from the ColumnSettings would allow you to do that.
    3. You said you use multiple selection, but it has not been enabled in the configuration that you have provided – do you use this option in your application? I am asking you, because that might turn out to be important while I am testing in an isolated sample on my side.

     

    Providing me those details would be greatly appreciated and would allow me to give you a more precise answer.

     

    I look forward to hearing from you.

  • 30
    Offline posted in reply to Vasil Pavlov

    Thanks for your reply. 

    Please see my answer to your questions

    Ans 1: Yes it is 2019.1. I apologize

    Ans 2: No I cannot even copy the column value. I cannot see the copy many when I right click on the cell or I cannot select the value.

    Ans 3: I have attached my complete cshtml file for your reference

    1321.CopyPasteIssue.txt
    @using Infragistics.Web.Mvc
    @model IQueryable<CEMT.Common.DomainModel.SearchResults.ExceptionsFreeOfPayment>
    @{
        ViewBag.Title = "Search Exceptions - Free of Payment";
    }
    
    <!-- Ignite UI Required Combined CSS Files -->
    <link href="~/IgniteUI/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
    <link href="~/IgniteUI/css/structure/infragistics.css" rel="stylesheet" />
    <script src="~/Scripts/modernizr-2.8.3.js"></script>
    
    <script src="~/Scripts/jquery-1.11.3.min.js"></script>
    <script src="~/Scripts/jquery-ui.min.js"></script>
    
    <!-- Ignite UI Required Combined JavaScript Files -->
    <script src="~/IgniteUI/js/infragistics.core.js"></script>
    <script src="~/IgniteUI/js/infragistics.lob.js"></script>
    <script src="~/IgniteUI/js/modules/infragistics.util.js"></script>
    <script src="~/IgniteUI/js/modules/infragistics.datasource.js"></script>
    <script src="~/IgniteUI/js/modules/infragistics.ui.shared.js"></script>
    <script src="~/IgniteUI/js/modules/infragistics.ui.editors.js"></script>
    
    <!-- Used to add modal loading indicator for igGrid -->
    <script src="~/IgniteUI/grid-modal-loading-inicator.js"></script>
    
    <style type="text/css">
        input.button-style {
            margin-top: 10px;
        }
    </style>
    <h2>Free Of Payment Search Results</h2>
    <span><i>If you are redirected back to the intial search screen this is because your search criteria session store has expired, please re-establish your search critieria and continue.</i></span>
    @if ((bool)@ViewData["ReadOnly"] == false)
    {
        @(Html.Infragistics()
                            .Grid(Model)
                            .ID("Grid")
                            .Height("600px")
                            .Width("1200px")
                            .AutoGenerateColumns(false)
                            .AutoGenerateLayouts(false)
                            .RenderCheckboxes(true)
                            .PrimaryKey("BreakID")
                            .FixedHeaders(false)
                            .Columns(column =>
                            {
                            column.For(x => x.SourceCode).HeaderText("Source").Width("70px");
                            column.For(x => x.ReasonCode).HeaderText("Reason").Width("70px");
                            column.For(x => x.Comments).HeaderText("Comment").Width("200px");
                            column.For(x => x.UpdateMethod).Hidden(true);
                            column.For(x => x.Researched).Hidden(true);
    
    
                            column.For(x => x.IocCode).HeaderText("Admin").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${IocCode}</div>{{else}}${IocCode}  {{/if}}"); ;
                            column.For(x => x.TransactionNumber).HeaderText("Transaction").Width("130px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${TransactionNumber}</div>{{else}}<span style='-moz-user-select:all !important; user-select:all !important'>${TransactionNumber}</span>  {{/if}}"); ; ;
        column.Unbound("Details").Template("<input type='button' onclick='showDetails(${BreakID})' value='Detail' class='btn btn-xs'/>").HeaderText("Details").Width("60px");
        column.For(x => x.Account).HeaderText("Account").Width("90px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Account}</div>{{else}}${Account}  {{/if}}"); ; ;
        column.For(x => x.Age).HeaderText("Age").Width("50px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Age}</div>{{else}}${Age}  {{/if}}"); ; ;
        column.For(x => x.CSD).HeaderText("CSD").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${CSD}</div>{{else}}${CSD}  {{/if}}"); ; ;
        column.For(x => x.ISIN).HeaderText("ISIN").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${ISIN}</div>{{else}}${ISIN}  {{/if}}"); ; ;
        column.For(x => x.TrnType).HeaderText("Type").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${TrnType}</div>{{else}}${TrnType}  {{/if}}"); ; ;
    
        column.For(x => x.Location).HeaderText("Loc").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Location}</div>{{else}}${Location}  {{/if}}"); ; ;
        column.For(x => x.CREATED_TS).HeaderText("Enter Date").Width("140px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${CREATED_TS}</div>{{else}}${CREATED_TS}  {{/if}}");
    
        column.For(x => x.Age30DAYS).HeaderText("Age>=30").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Age30DAYS}</div>{{else}}${Age30DAYS}  {{/if}}"); ; ;
        column.For(x => x.HighRiskBIM).HeaderText("High Risk BIM").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${HighRiskBIM}</div>{{else}}${HighRiskBIM}  {{/if}}"); ; ;
        column.For(x => x.MediumRiskBIM).HeaderText("Medium Risk BIM").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${MediumRiskBIM}</div>{{else}}${MediumRiskBIM}  {{/if}}"); ; ;
        column.For(x => x.ClientServiceManager).HeaderText("Name").Width("150px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${ClientServiceManager}</div>{{else}}${ClientServiceManager}  {{/if}}"); ; ;
        column.For(x => x.Checked).HeaderText("CHK").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Checked}</div>{{else}}${Checked}  {{/if}}"); ; ;
        column.For(x => x.MultipleUpdates).HeaderText("Multiple").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${MultipleUpdates}</div>{{else}}${MultipleUpdates}  {{/if}}"); ; ;
        column.For(x => x.VerifiedIndicator).HeaderText("Verified").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${VerifiedIndicator}</div>{{else}}${VerifiedIndicator}  {{/if}}");
    
        column.For(x => x.BreakID).HeaderText("Break ID").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${BreakID}</div>{{else}}${BreakID}  {{/if}}"); ; ;
    })
                            .Features(f => { f.Tooltips().Visibility(TooltipsVisibility.Always).ColumnSettings(settings => settings.ColumnSetting().ColumnKey("Comments").AllowTooltips(true)).ShowDelay(100); })
                            .Features(feature =>
                            {
                                feature.Updating().ColumnSettings(cs =>
                                {
                                    cs.ColumnSetting().ColumnKey("Details").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("BreakID").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("IocCode").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("ClientServiceManager").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("CREATED_TS").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("TransactionNumber").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("TrnType").ReadOnly(true);
    
                                    cs.ColumnSetting().ColumnKey("Location").ReadOnly(true);
    
                                    cs.ColumnSetting().ColumnKey("MultipleUpdates").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Account").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Age").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Age30DAYS").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("HighRiskBIM").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("MediumRiskBIM").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Checked").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("VerifiedIndicator").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("CSD").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("ISIN").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("SourceCode").Required(true).EditorType(ColumnEditorType.Combo).ComboEditorOptions(co => co.DropDownWidth(300).DataSource(ViewBag.SourceCodes).ID("comboEditorSourceCode").ValueKey("SourceCode").TextKey("SourceCodeDescription").Mode(ComboMode.DropDown).EnableClearButton(false).AddClientEvent("selectionChanged", "selChanged"));
                                    cs.ColumnSetting().ColumnKey("ReasonCode").Required(true).EditorType(ColumnEditorType.Combo).ComboEditorOptions(co => co.DropDownWidth(300).DataSource(ViewBag.ReasonCodes).ValueKey("ReasonCode").TextKey("ReasonCodeDescription").Mode(ComboMode.DropDown).EnableClearButton(false));
                                    cs.ColumnSetting().ColumnKey("Comments").Required(false).EditorType(ColumnEditorType.Text).Validation(true).TextEditorOptions(o => o.MaxLength(255).TextMode(TextEditorTextMode.Multiline));
    
                                }).EnableAddRow(false).EnableDeleteRow(false);
                                feature.Selection().Mode(SelectionMode.Row).MultipleSelection(true).Activation(true);
                                feature.Sorting();
                                feature.Resizing();
                                feature.Paging().PageSize(50).AddClientEvent("pageIndexChanging", "CheckUnSaved"); ;
                                feature.Filtering().Mode(FilterMode.Simple);
    
    
                            })
                           .DataSourceUrl(Url.Action("GetFreeOfPayment"))
                                .UpdateUrl(Url.Action("FreeOfPaymentSaveData"))
                            .DataBind()
                            .Render()
        )
    
        <input type="button" id="saveChanges" class="button-style" value="Save Changes" />
        <input type="button" id="undo" class="btn btn-sm btn-default" value="Undo Unsaved Changes" />
        <!--<input type="button" id="redo" class="btn btn-sm btn-default" value="Redo" />-->
        <div>
            <div class="row">
                <div class="col-sm-3">
                    <h5>Source Code</h5>
                    @(Html.Infragistics().Combo()
                                           .ID("igComboSourceCode")
                                           .DropDownWidth(300)
                                           .ValueKey("SourceCode")
                                           .TextKey("SourceCodeDescription")
                                           .AddClientEvent("selectionChanged", "igComboSourceCodeSelectionChanged")
                                           .DataSource(ViewBag.SourceCodes)
                                           .DataBind()
                                           .Render())
                </div>
                <div class="col-sm-3">
                    <h5>Reason Code</h5>
                    @(Html.Infragistics().Combo()
                                           .ID("igComboReasonCode")
                                           .ValueKey("ReasonCode")
                                           .DropDownWidth(300)
                                           .TextKey("ReasonCodeDescription")
                                           .DataBind()
                                           .Render())
                </div>
                <div class="col-sm-3">
                    <h5>Comments</h5>
                    @(Html.Infragistics().TextEditor()
                                           .ID("igTextboxComment")
                                           .MaxLength(255)
                                           .TextMode(TextEditorTextMode.Multiline)
                                           .Render())
                </div>
                <div class="col-sm-3">
                    <input type="button" id="MultipleUpdate" class="btn btn-sm btn-default" value="Multiple Update" />
                    <input type="button" id="Researched" class="btn btn-sm btn-default" value="Researched" />
                </div>
            </div>
        </div>
    }
    else
    {
    
        @(Html.Infragistics()
                            .Grid(Model)
                            .ID("Grid")
                            .Height("600px")
                            .Width("1200px")
                            .AutoGenerateColumns(false)
                            .AutoGenerateLayouts(false)
                            .RenderCheckboxes(true)
                            .PrimaryKey("BreakID")
                            .FixedHeaders(false)
                            .Columns(column =>
                            {
                                column.For(x => x.SourceCode).HeaderText("Source").Width("70px");
                                column.For(x => x.ReasonCode).HeaderText("Reason").Width("70px");
                                column.For(x => x.Comments).HeaderText("Comment").Width("200px");
    
    
                                column.For(x => x.IocCode).HeaderText("Admin").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${IocCode}</div>{{else}}${IocCode}  {{/if}}"); ;
                                column.For(x => x.TransactionNumber).HeaderText("Transaction").Width("130px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${TransactionNumber}</div>{{else}}<span style='-moz-user-select:all !important; user-select:all !important'>${TransactionNumber}</span>  {{/if}}"); ; ;
                                column.Unbound("Details").Template("<input type='button' onclick='showDetails(${BreakID})' value='Detail' class='btn btn-xs'/>").HeaderText("Details").Width("60px");
                                column.For(x => x.Account).HeaderText("Account").Width("90px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Account}</div>{{else}}${Account}  {{/if}}"); ; ;
    
                                column.For(x => x.Age).HeaderText("Age").Width("50px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Age}</div>{{else}}${Age}  {{/if}}"); ; ;
                                column.For(x => x.CSD).HeaderText("CSD").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${CSD}</div>{{else}}${CSD}  {{/if}}"); ; ;
                                column.For(x => x.ISIN).HeaderText("ISIN").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${ISIN}</div>{{else}}${ISIN}  {{/if}}"); ; ;
                                column.For(x => x.TrnType).HeaderText("Type").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${TrnType}</div>{{else}}${TrnType}  {{/if}}"); ; ;
    
                                column.For(x => x.Location).HeaderText("Loc").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Location}</div>{{else}}${Location}  {{/if}}"); ; ;
                                column.For(x => x.CREATED_TS).HeaderText("Enter Date").Width("140px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${CREATED_TS}</div>{{else}}${CREATED_TS}  {{/if}}");
    
                                column.For(x => x.Checked).HeaderText("CHK").Width("60px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Checked}</div>{{else}}${Checked}  {{/if}}"); ; ;
                                column.For(x => x.Age30DAYS).HeaderText("Age>=30").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${Age30DAYS}</div>{{else}}${Age30DAYS}  {{/if}}"); ; ;
                                column.For(x => x.HighRiskBIM).HeaderText("High Risk BIM").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${HighRiskBIM}</div>{{else}}${HighRiskBIM}  {{/if}}"); ; ;
                                column.For(x => x.MediumRiskBIM).HeaderText("Medium Risk BIM").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${MediumRiskBIM}</div>{{else}}${MediumRiskBIM}  {{/if}}"); ; ;
                                column.For(x => x.ClientServiceManager).HeaderText("Name").Width("150px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${ClientServiceManager}</div>{{else}}${ClientServiceManager}  {{/if}}"); ; ;
                                column.For(x => x.MultipleUpdates).HeaderText("Multiple").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${MultipleUpdates}</div>{{else}}${MultipleUpdates}  {{/if}}"); ; ;
                                column.For(x => x.VerifiedIndicator).HeaderText("Verified").Width("70px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${VerifiedIndicator}</div>{{else}}${VerifiedIndicator}  {{/if}}");
                                column.For(x => x.BreakID).HeaderText("Break ID").Width("100px").Template("{{if ${VerifiedIndicator}=='Y'}}<div style='background-color:#52D017'>${BreakID}</div>{{else}}${BreakID}  {{/if}}"); ; ;
                            })
                            .Features(f => { f.Tooltips().Visibility(TooltipsVisibility.Always).ColumnSettings(settings => settings.ColumnSetting().ColumnKey("Comments").AllowTooltips(true)).ShowDelay(100); })
                            .Features(feature =>
                            {
                                feature.Updating().ColumnSettings(cs =>
                                {
    
                                    cs.ColumnSetting().ColumnKey("Details").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("BreakID").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("IocCode").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("ClientServiceManager").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("CREATED_TS").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("TransactionNumber").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("TrnType").ReadOnly(true);
    
                                    cs.ColumnSetting().ColumnKey("Location").ReadOnly(true);
    
                                    cs.ColumnSetting().ColumnKey("MultipleUpdates").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Account").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Age").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Age30DAYS").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("HighRiskBIM").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("MediumRiskBIM").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Checked").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("VerifiedIndicator").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("CSD").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("ISIN").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("SourceCode").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("ReasonCode").ReadOnly(true);
                                    cs.ColumnSetting().ColumnKey("Comments").ReadOnly(true);
    
    
    
                                }).EnableAddRow(false).EnableDeleteRow(false);
                                feature.Sorting();
                                feature.Resizing();
                                feature.Paging().PageSize(50);
                                feature.Filtering().Mode(FilterMode.Simple);
    
    
                            })
                            .DataSourceUrl(Url.Action("GetFreeOfPayment"))
                            .UpdateUrl(Url.Action("FreeOfPaymentSaveData"))
                            .DataBind()
                            .Render()
        )
    }
    <input type="button" id="buttonDataBind" value="Refresh Grid" />
    
    @Html.ActionLink("Export Search Results", "Export")
    <div id="EditDiv" class='modal fade in'>
        <div class="modal-dialog">
            <div class="modal-content">
                <div id='myModalContent'>
    
                </div>
            </div>
        </div>
    </div>
    <script src="~/igniteui/js/modules/i18n/regional/infragistics.ui.regional-en-GB.js"></script>
    <script>
        $("#buttonDataBind").igButton({
            labelText: $("#buttonDataBind").val(),
            click: function (e) {
                $("#Grid").igGrid("dataBind");
            }
        });
    
    
        function showDetails(pid) {
            var ph = $("#EditDiv");
            ph.load("/FreeOfPaymentSearch/Details?breakID=" + pid,
                function () {
                    ph.dialog({
                        modal: true,
                        closeOnEscape: true,
                        width: 900,
                        height: 800,
                        title: "Free of payment",
                        resizable: true,
                        buttons: [
                            {
                                text: "Ok",
                                icon: "ui-icon-heart",
                                click: function () {
                                    $(this).dialog("close");
                                }
                            }
                        ]
                    });
                });
        }
    
    
        function igComboSourceCodeSelectionChanged(evt, ui) {
            var selectedSourceCode = ui.items[0].data.SourceCode;
            var url = "/FreeOfPaymentSearch/reasonCode-combo-dataCodes";
            var editor = $("#igComboReasonCode");
    
            $.ajax({
                url: url,
                type: "POST",
                data: { sourceCode: selectedSourceCode },
                success: function (data) {
                    editor.igCombo("option", "dataSource", data);
                    editor.igCombo("dataBind");
                    //editor.index(0);
                }
            });
        }
    
    
        function selChanged(evt, ui) {
            var selectedSourceCode = ui.items[0].data.SourceCode;
            var url = "/FreeOfPaymentSearch/reasonCode-combo-dataCodes";
            var editor = $("#Grid").igGridUpdating("editorForKey", "ReasonCode").data("igCombo");
    
            $.ajax({
                url: url,
                type: "POST",
                data: { sourceCode: selectedSourceCode },
                success: function (data) {
                    editor.options.dataSource = data;
                    editor.dataBind();
                    //editor.index(0);
                }
            });
        }
    
        function CheckUnSaved(evt, ui) {
            var grid = $("#Grid")
    
            if (grid != null) {
                var changes = grid.data('igGrid').pendingTransactions();
    
                if (changes.length != 0) {
    
                    if (!confirm('You are going to lose any unsaved changes. Are you sure?')) {
                        evt.preventDefault();
                    }
                }
            }
        };
    </script>
    
    <script src="~/IgniteUI/js/modules/infragistics.gridexcelexporter.js"></script>
    <script src="~/IgniteUI/js/modules/infragistics.documents.core_core.js"></script>
    <script src="~/IgniteUI/js/modules/infragistics.excel_core.js"></script>
    <script>
        //$.ig.loader({
        //    scriptPath: "~/IgniteUI/js",
        //    cssPath: "~/IgniteUI/css",
        //    resources: 'igGrid,' +
        //        'modules/infragistics.documents.core.js,' +
        //        'modules/infragistics.excel.js,' +
        //        'modules/infragistics.gridexcelexporter.js'
        //});
    
        function wireUpEvents() {
    
            // Check for grid changes before page unload
            window.onbeforeunload = function (e) {
                var changes = $("#Grid").data('igGrid').pendingTransactions();
                if (changes.length != 0) {
                    //  if (!confirm('You are going to lose any unsaved changes. Are you sure?')) {
                    //    e.preventDefault();
                    var dialogtext = 'You are going to lose any unsaved changes. Are you sure?';
                    e.returnValue = dialogtext;
                    return dialogtext;
                }
            }
        }
    
    
        // Wire up the events as soon as the DOM is ready
        $(document).ready(function () {
            wireUpEvents();
        });
    
        var updates, customersLookup = [], loadingIndicator;
        $(function () {
            var grid = $("#Grid"), comboDataSource = {};
            //comboDataSource = grid.data("igGridUpdating").options.columnSettings[2].editorOptions.dataSource;
            //for (var i = 0; i < comboDataSource.length; i++) {
            //   customersLookup[comboDataSource[i].ID] = comboDataSource[i];
            //}
            $("#saveChanges").igButton({ labelText: $("#saveChanges").val(), disabled: true });
            $("#undo").igButton({ labelText: $("#undo").val(), disabled: true });
            //$("#redo").igButton({ labelText: $("#redo").val(), disabled: true });
    
            loadingIndicator = new GridModalLoadingIndicator(grid);
    
            grid.on("iggriddatabinding", function (e, args) {
                loadingIndicator.show();
            });
    
            grid.on("iggriddatabound", function (e, args) {
                loadingIndicator.hide();
            });
    
            grid.on("iggridupdatingrowdeleted", function (e, args) {
                $("#undo").igButton("option", "disabled", false);
                $("#saveChanges").igButton("option", "disabled", false);
            });
    
            grid.on("iggridupdatingrowadded", function (e, args) {
                $("#undo").igButton("option", "disabled", false);
                $("#saveChanges").igButton("option", "disabled", false);
            });
            grid.on("iggridupdatingeditrowended", function (e, args) {
                if (args.update) {
                    $("#undo").igButton("option", "disabled", false);
                    $("#saveChanges").igButton("option", "disabled", false);
                }
            });
            $("#undo").on('igbuttonclick',
                function (e, args) {
                    updates = $.extend({}, grid.data('igGrid').pendingTransactions());
                    $.each(updates, function (index, transaction) {
                        //this was grid.igGrid("rollback", transaction.rowId, true); but it keeps blowing up as the infragistics framework cannot find the row, so we roll back and then refresh the whole grid as below
                        grid.igGrid("rollback", transaction.rowId, false);
    
                    });
    
                    //this refresh is due to an issue with the ui update on the infragistics grid.
                    $("#Grid").igGrid("dataBind");
                    //$("#redo").igButton("option", "disabled", false);
                    $("#undo").igButton("disable");
                    $("#saveChanges").igButton("disable");
    
                    return false;
                }
            );
    
            $("#redo").on('igbuttonclick',
                function (e) {
                    $.each(updates, function (index, transaction) {
                        switch (transaction.type) {
                            case "row":
                                grid.igGridUpdating('updateRow', transaction.rowId, transaction.row, null, false);
                                break;
                            case "newrow":
                                grid.igGridUpdating('addRow', transaction.row, false);
                                break;
                            case "deleterow":
                                grid.igGridUpdating('deleteRow', transaction.rowId, false);
                                break;
                        }
    
                    });
                    $(this).igButton("disable");
                    $("#undo").igButton("option", "disabled", false);
                    $("#saveChanges").igButton("option", "disabled", false);
                }
            );
    
            $("#saveChanges").on('igbuttonclick',
                function (e) {
                    grid.igGrid("saveChanges", function saveSuccess() {
                        loadingIndicator.hide();
                        $("#Grid").igGrid("dataBind");
                    });
                    loadingIndicator.show();
                    $("#undo").igButton("disable");
                    $(this).igButton("disable");
    
                    return false;
                }
            );
            grid.on("iggridupdatingdatadirty", function (event, ui) {
                grid.igGrid("commit");
                //saving local changes to the datasource when sorting
                return false;
            });
        });
    
    
    </script>
    
    <script>
        $("#MultipleUpdate").on("click", function () {
            var defaultSourceCode = $("#igComboSourceCode").igCombo("value");
            var defaultReasonCode = $("#igComboReasonCode").igCombo("value");
            var comments = $("#igTextboxComment").igTextEditor("value");
            var selectedRows = $("#Grid").igGrid("selectedRows");
            var multiUpdate = 'Y';
            for (var i = 0; i < selectedRows.length; i++) {
                var row = selectedRows[i];
                $("#Grid").igGridUpdating("updateRow", row.id, { 'ReasonCode': defaultReasonCode, 'SourceCode': defaultSourceCode, 'Comments': comments, 'MultipleUpdates': multiUpdate, 'UpdateMethod': 'MultipleMethod' });  // in the last 2 columns
            }
    
            $("#saveChanges").igButton("option", "disabled", false);
            $("#undo").igButton("option", "disabled", false);
        });
    
        $("#Researched").on("click", function () {
    
            var selectedRows = $("#Grid").igGrid("selectedRows");
            var researched = 'Y';
            for (var i = 0; i < selectedRows.length; i++) {
                var row = selectedRows[i];
                $("#Grid").igGridUpdating("updateRow", row.id, { 'VerifiedIndicator': researched, 'Researched': 'Researched' });  // in the last 2 columns
            }
    
            $("#saveChanges").igButton("option", "disabled", false);
            $("#undo").igButton("option", "disabled", false);
        });
    
    </script>
    

    Please let me know if you need more information?

  • 485
    Offline posted in reply to Niranjan Vesikar

    Hello Niranjan,

     

    I tried reproducing the issue in an isolated code sample on my side, but I was not able to. I have attached the project as a zip file. It consists of an igGrid that uses a configuration similar to the one you have provided, and one of the columns, “ProductName” is ReadOnly. I am able to select and copy the text (and paste it in the next column “ProductCategory”. Here is the sample: 

    MVCGridCopyPaste.zip

     

    Please test it on your side; whether or not it works correctly may help indicate the nature of this problem - if it shows the Updating feature working correctly, this indicates a possible problem in the code of your application.  It will help if you could provide a small, isolated sample application that demonstrates the behavior you are seeing.

     

    Or, if this sample project is not an accurate demonstration of what you're trying to do, please feel free to modify it and send it back, or send a small sample project of your own if you have one.

     

    I look forward to your reply.

  • 23953
    Offline posted in reply to Niranjan Vesikar

    Hello Niranjan,

     

    For Selection feature to work we have to disable cell text selection. This is described as a known issue in our help documentation:

    Text selection is not working when Selection feature is enabled. There's also a workaround described there, but might now work for some cases. Please try it and let me know if this works for you.

     

    Best regards,
    Martin Pavlov
    Infragistics, Inc.