This is a migrated thread and some comments may be shown as answers.

setting cancel to true in Radrotator OnClientItemClicking is canceling my checkbox onClick Event

1 Answer 33 Views
Rotator
This is a migrated thread and some comments may be shown as answers.
CJ chavez
Top achievements
Rank 1
CJ chavez asked on 27 Oct 2012, 07:39 PM
Hi.
I'm using a Radrotator with Item template inside as follows:

ASPX
<telerik:RadRotator runat="server" ID="rotatorImagesList" RotatorType="Buttons" Width="100%"
    Height="150px" WrapFrames="false" OnItemClick="rotatorImagesList_SelectImage"
    OnClientItemClicking="rotatorImagesList_OnClientItemClicking">
    <ItemTemplate>
        <div>
            <asp:CheckBox ID="chkSel" runat="server" Checked='<%#Eval("isSelected")==DBNull.Value?false:Eval("isSelected") %>'
                onclick="chkClick(this)" />
            <asp:ImageButton ID="btnDel" runat="server" OnClientClick="CancelItemClick(this)"
                CssClass="deletebutton" ImageUrl="~/App_Themes/Office2007/Grid/Cancel.gif"></asp:ImageButton>
        </div>
        <div>
            <telerik:RadBinaryImage EnableTheming="false" runat="server" ID="binaryImageThumbnail"
                Width="103px" Height="103px" ResizeMode="Fit" DataValue='<%# DataBinder.Eval(Container.DataItem,"ThumbnailData") %>'
                BorderColor="Black" BorderStyle="Solid" onClick="ImageClick(this)" />
        </div>
        <div>
            <asp:HiddenField ID="hiddenFieldPhotoRIDContainer" runat="server" Value='<%# DataBinder.Eval(Container.DataItem,"NCO_RID") %>' />
            <asp:HiddenField ID="hiddenFieldIsDeleted" runat="server" Value='<%# DataBinder.Eval(Container.DataItem,"isDeleted") %>' />
        </div>
    </ItemTemplate>
</telerik:RadRotator>

I only want to "Click" on the item when user clicks on the image, since at this time, I run the rotatorImagesList_SelectImage in which I do some server code. otherwise I do not want a postback to run the rotatorImagesList_SelectImage event.

I cancel ItemClick when I click the btnDel, since I will be deleting this image. this works fine.

but when I cancel click when the checkbox is clicked, the Checkbox can not be "checked".

here is my Javascript:
var currIndex;
var isDeleting;
var allowClick;
 
function pageLoad() {
 
    isDeleting = false;
    allowClick = false;
}
 
function CancelItemClick(sender, eventArgs) {
 
    currIndex = getIndexFromId(sender.id);
    allowClick = true;
    isDeleting = true;
}
 
function ImageClick(sender) {
 
    currIndex = getIndexFromId(sender.id);
    isDeleting = false;
    allowClick = true;
}
 
function chkClick(sender) {
    currIndex = getIndexFromId(sender.id);
    isDeleting = false;
    allowClick = false;
 
}
 
function rotatorImagesList_OnClientItemClicking(sender, eventArgs) {
    if (allowClick == true) {
 
        var hfVal = document.getElementById(sender.get_id() + "_i" + currIndex + "_" + "hiddenFieldPhotoRIDContainer").value;
 
        if (isDeleting == true) {
            __doPostBack("btnDel", hfVal);
            eventArgs.set_cancel(true);
        }
 
    }
    else {
        eventArgs.set_cancel(true);
    }
}
 
function getIndexFromId(string) {
    var matches = string.match(/_i([0-9]+)/);
    return matches[1];
 
}


Any Suggestions?

Thanks.

1 Answer, 1 is accepted

Sort by
0
Accepted
Slav
Telerik team
answered on 31 Oct 2012, 12:11 PM
Hi,

When you cancel the click client-side event of the RadRotator's item, the click event of the elements in its content is also canceled. As a result the checkbox in the items is not checked.

I would suggest a different approach if you want to initiate a postback only then the RadBinaryImage is clicked. Please remove the handlers specified in the properties OnItemClick and OnClientItemClicking of RadRotator and call the method  __doPostBack to postback when handling the client-side click event of the binary image and then execute your logic on the server-side.

Kind regards,
Slav
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Rotator
Asked by
CJ chavez
Top achievements
Rank 1
Answers by
Slav
Telerik team
Share this question
or