I have a main page with RadTabStrip/RadMultiPage setup. I'd like to trigger an update to a portion of that page when user makes a change in a RadPageView. So on my main page I have a portion that is a summary with datasource and form and numbers need to update as people make changes to various sub-pages.
On each of those RadPageView I have aspx pages with RadForms with (edit/update/cancel buttons). I'd also like to catch if a user tries to change tabs, navigate away from the page, or close with the X on the upper right browser if they are in edit mode on a RadPageView aspx page.
Any assistance would be greatly appreciated.
Using CSS and html need the below format like category and sub-categories (Definetly it should be like expanding and collapsing functionality). Could anyone please give me some ideas on aspx side as well as code-behind. That would be great.
I have a RadDataform, which has DropDownLists added to the Edit and Insert Item Templates :
<telerik:RadDataForm RenderMode="Lightweight" ID="FormCN" runat="server"
OnNeedDataSource="FormCN_NeedDataSource"
OnItemInserting="FormCN_ItemInserting"
OnItemUpdating="FormCN_ItemUpdating"
OnItemDeleting="FormCN_ItemDeleting"
OnPreRender="FormCN_PreRender"
DataKeyNames="CN_SEQ"
Skin="MetroTouch" >
...
<ItemTemplate>
...
</ItemTemplate>
<EditItemTemplate>
...
<div class="rdfRow">
<div class="rdfRight" >
<telerik:RadComboBox ID="cmbPrep" OnPreRender="cmbPrep_PreRender" OnSelectedIndexChanged="cmbPrep_SelectedIndexChanged" AutoPostBack="true" AllowCustomText="true" runat="server" Skin="MetroTouch" EmptyMessage="Prep" style="float:right;"></telerik:RadComboBox>
</div>
<telerik:RadTextBox ClientEvents-OnLoad="setHeight" RenderMode="Lightweight" TextMode="MultiLine" ID="PREP" runat="server" Text='<%# Bind("PREP") %>' WrapperCssClass="rdfInput" />
</div>
...
</EditItemTemplate>
<InsertItemTemplate>
...
<div class="rdfRow">
<div class="rdfRight" >
<telerik:RadComboBox ID="cmbPrep2" OnPreRender="cmbPrep2_PreRender" OnSelectedIndexChanged="cmbPrep2_SelectedIndexChanged" AutoPostBack="true" AllowCustomText="true" runat="server" Skin="MetroTouch" EmptyMessage="Prep" style="float:right;"></telerik:RadComboBox>
</div>
<telerik:RadTextBox ClientEvents-OnLoad="setHeight" RenderMode="Lightweight" TextMode="MultiLine" ID="PREP2" runat="server" Text='<%# Bind("PREP") %>' WrapperCssClass="rdfInput" />
</div>
...
</InsertItemTemplate>
Using NeedDataSource:
Protected Sub FormCN_NeedDataSource(sender As Object, e As RadDataFormNeedDataSourceEventArgs)
TryCast(sender, RadDataForm).DataSource = SourceDataTable
End Sub
Public ReadOnly Property SourceDataTable() As DataTable
Get
Dim obj As [Object] = ViewState("SourceDataTable")
If obj IsNot Nothing Then
Return DirectCast(obj, DataTable)
Else
Dim strConnString As String = ConfigurationManager.ConnectionStrings(Session("mYear")).ConnectionString
Dim con As OracleConnection = New OracleConnection(strConnString)
cmdQuery = "SELECT QUEUE, BATCH_NUMBER, " &
"CN_SEQ, CN_YEAR, METHOD, " &
"PREPMETHOD, PREP, RECEIPT, " &
"SAMPPREP, SAMPANAL, CALIBRATION, " &
"BLANKS, SURROGATES, SPIKES, " &
"INTERNSTANDARD, SAMPLES, OTHER, " &
"DUPLICATES, SERIALDILUTION " &
"FROM CN_DETAILS " &
"WHERE QUEUE = '" & cmbQueue.SelectedValue & "' AND BATCH_NUMBER = " & cmbBatchNumber.SelectedValue & " "
Dim cmd As OracleCommand = New OracleCommand(cmdQuery)
cmd.Connection = con
cmd.CommandType = CommandType.Text
Dim da As OracleDataAdapter = New OracleDataAdapter(cmd)
Dim dt As New DataTable()
da.Fill(dt)
ViewState("SourceDataTable") = dt
Return dt
cmd.Dispose()
con.Close()
con.Dispose()
End If
End Get
End Property
On DropDownList Selected Item Changed, I need to populate it's associated textbox with the ddl value. This works well for the EditItem:
Protected Sub cmbPrep_SelectedIndexChanged(sender As Object, e As RadComboBoxSelectedIndexChangedEventArgs)
Dim cmbItem As RadComboBox = TryCast(sender, RadComboBox)
Dim radTextBox As RadTextBox = cmbItem.Parent.FindControl("PREP")
radTextBox.Text = e.Value.ToString
End Sub
How do I replicate this functionalit for the InsertItem? I tried this:
Protected Sub cmbPrep2_SelectedIndexChanged(sender As Object, e As RadComboBoxSelectedIndexChangedEventArgs)
Dim cmbItem As RadComboBox = TryCast(sender, RadComboBox)
Dim radTextBox As RadDataFormInsertItem = cmbItem.Parent
'radTextBox.Text = e.Value.ToString
Dim insertedItem As RadDataFormInsertItem = TryCast(radTextBox, RadDataFormInsertItem)
Dim newValues As New Hashtable()
insertedItem.ExtractValues(newValues)
newValues("PREP") = e.Value.ToString
newValues("CN_SEQ") = 9999999
newValues("CN_YEAR") = "2020"
newValues("QUEUE") = cmbQueue.SelectedValue
newValues("BATCH_NUMBER") = cmbBatchNumber.SelectedValue
Dim dt As DataTable = ViewState("SourceDataTable")
Dim newRow As DataRow = dt.NewRow()
For Each entry As DictionaryEntry In newValues
newRow(DirectCast(entry.Key, String)) = entry.Value
Next
dt.Rows.Add(newRow)
ViewState("SourceDataTable") = dt
End Sub
The corresponding InsertItem textbox is not updated, however, if you click cancel and return to View, the item text is there. What am I missing please?
I can determine if a RadDataForm Is in Insert mode with code like this:
if ($find("<%= frmClaim.ClientID %>")._isItemInserted) { ...
But how can I determine if a RadDataForm is in edit mode from client side JavaScript?
I have a RadDataForm that contains several RadDropdownLists. They are all using client binding each with their own instance of RadClientDataSource.
How can I unsure the dropdown list data is retrieved and bound before the dataform data is retrieved and attempted to bind?
eg. I have event handler on OnSetValues as follows:
<
telerik:RadDataForm
RenderMode
=
"Lightweight"
runat
=
"server"
ID
=
"RadDataForm1"
DataKeyNames
=
"RecordID"
RenderWrapper
=
"true"
ClientDataSourceID
=
"RadClientDataSource1"
>
<
ClientSettings
>
<
ClientEvents
OnSetValues
=
"dataFormSetValues"
OnGetValues
=
"dataFormGetValues"
OnDataFormCreated
=
"dataFormCreated"
/>
</
ClientSettings
>
function
dataFormSetValues(sender, args) {
var
dataItem = args;
$telerik.findControl(document,
"EditJobTypeDD"
).findItemByValue(dataItem.JobType).select();
}
The .select() in the javascript function above will fail occasionally when the webservice for the form data returns quicker than the webservice to populate the dropdown list, because there are no items in the dropdownlist yet.
Is there a best practice to implement this sort of scenario correctly?
I started with this demo: Live Demos\DataForm\Data-Binding\Client-Data-Source-Binding
The demo code is working well.
However, I run into a problem when I try to add a TimePicker or DateTimePicker to the EditItemTemplate or InsertItemTemplate, as it is seems to be causing the ItemTemplate to not "hide". Also, the clock icon on the picker fails to display the popup with the list of times.
Pasting the following into the EditItemTemplate or InsertItemTemplate is causing it to break:
<
div
class
=
"rdfRow"
>
<
telerik:RadTimePicker
RenderMode
=
"Lightweight"
ID
=
"temp"
Width
=
"100px"
runat
=
"server"
dateinput-label
=
""
DateInput-DateFormat
=
"HH:mm"
TimeView-TimeFormat
=
"HH:mm"
></
telerik:RadTimePicker
>
</
div
>
There are no problems however if I add the above control elsewhere in the page. A DatePicker works fine.
There are no console errors and this behaviour occurs in both Chrome and Edge.
Is it possible to use a userControl for the edit and insert item templates and take advantage of automatic update/inserts. In my (limited) testing, I can get the edit template to populate, it just can't find the fields when updating.
Alternatively, is it possible to use either the edit or insert itemTemplate for both insert and update functions?
My edit and insert templates are identical, I'd like to only have to maintain it in one place.