Row_Rendered Server Event Examples

Tips submitted by ASPMaker users

Row_Rendered Server Event Examples

Postby dunga » Tue Jan 14, 2014 9:48 pm

I will list here(as I learn) working examples of Server Events with explanations:

Please add yours based on the examples provided


Example 1: Row_Rendered


' Change the icon image based on a field value
'if the "Country" name selected is "Azerbaijan" then display Azerbaijan flag in a "Flag" field
'and if the "Country" name selected is "Azerbaijan" then display Azerbaijan map in a "GeoMap" field

If Country.ViewValue = "Azerbaijan" Then
Flag.ViewValue= "<img src='flags/22px-Flag_of_Azerbaijan.svg.png' border='0'>" & Flag.ViewValue
GeoMap.ViewValue= "<img src='maps/af-map.gif' border='0'>" & GeoMap.ViewValue
End If
------------------------------------------------------------------------------------------------------------
Example 2:Row_Rendered

'Change cell color based on the value inserted
'if the value of "Availability" cell equals to "yes" color the cell "green" else if the value of the "availability"cell is "no" color the cell "red"
If Availability.CurrentValue = "YES" Then
Availability.CellAttrs.Append "style", "background-color: #00ff00;"

ElseIf Availability.CurrentValue = "NO" Then
Availability.CellAttrs.Append "style", "background-color: #ff0000;"

End If
-------------------------------------------------------------------------------------------------------
Example 3:Row_Rendered

'sorting records alphanumerically alphabetically
'if your field contains value like 1,10,2,20,3,30b,30c,30z,30a but you want to click the column header and sort them alpha-numerically
<Field>.ViewValue = "P" & <Field>.ViewValue
------------------------------------------------------------------------------------------------------
dunga
 
Posts: 60
Joined: Mon Dec 17, 2012 12:52 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Wed Mar 19, 2014 7:36 pm

Here are some examples of items that I have used.

Example:1
I often use <br/> between words in the caption to narrow the columns. Eg. Claim<br/>Date
This works fine on the list page but makes that row taller on the add/edit/search pages.
To customize the header on the add/edit/search pages, use the Page_Load server event on those pages and add the following
for each field that you use the <br/> on.
TableOrView.FieldName.FldCaption = "Claim Date"

If you also set the alignment to Centered( which will also show up on the view page), you will want to change back to left align on the view page.
View Page: Page_DataRendering
Warranty.ClaimDate.CellCssStyle = "text-align:Left;"

Example:2
Add column headers above the View Edit Delete icons.
Use the ListOptions_Load server event
ListOptions.GetItem("view").Header = "View"
ListOptions.GetItem("view").CssStyle = "text-align:center;"
ListOptions.GetItem("edit").Header = "Edit"
ListOptions.GetItem("edit").CssStyle = "text-align:center;"
ListOptions.GetItem("delete").Header = "Delete"
ListOptions.GetItem("delete").CssStyle = "text-align:center;"

To further extend this, you can show or hide these icons based on a value on the list page.(view is Warranty, field is Approved)
List Page:ListOptions_Rendered
If Warranty.Approved.ListViewValue = "Entered" Then
ListOptions.GetItem("view").Header = "View"
ListOptions.GetItem("view").CssStyle = "text-align:center;"
ListOptions.GetItem("edit").Header = "Edit"
ListOptions.GetItem("edit").CssStyle = "text-align:center;"
ListOptions.GetItem("delete").Header = "Delete"
ListOptions.GetItem("delete").CssStyle = "text-align:center;"
ElseIf Warranty.Approved.ListViewValue = "Declined" Then 'this is the value that you want to hide the Edit icon for
ListOptions.GetItem("view").Header = "View"
ListOptions.GetItem("view").CssStyle = "text-align:center;"
ListOptions.GetItem("edit").Header = "Edit"
ListOptions.GetItem("edit").Body = ""
ListOptions.GetItem("delete").Header = "Delete"
ListOptions.GetItem("delete").CssStyle = "text-align:center;"
Else
ListOptions.GetItem("view").Header = "View"
ListOptions.GetItem("view").CssStyle = "text-align:center;"
ListOptions.GetItem("edit").Header = "Edit"
ListOptions.GetItem("edit").Body = ""
ListOptions.GetItem("delete").Header = "Delete"
ListOptions.GetItem("delete").CssStyle = "text-align:center;"
ListOptions.GetItem("delete").Body = ""
End If

Example:3
Redirest a user to a certain page based on their User Level(User Level Security)
Other >Login Page: User_LoggedIn
If CurrentUserLevel = 7 Then
response.Redirect("rdefault.asp")
ElseIf CurrentUserLevel = 12 Then
response.Redirect("YourSelectedPagelist.asp")
Else
response.Redirect("tblUserslist.asp")
End If

Example:4
Add text above(Page_DataRendering) or below(Page_DataRendered) your form on the list page.
Response.Write "<br />"
Response.Write("Your Text here")
Response.Write "<br />"
Response.Write("Your Text here")
Response.Write "<br />"

More to come....
Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Wed Mar 26, 2014 9:48 pm

As promised
Example 1
I sometimes need values from my my users table(used for registration) to fill in other fields on some add pages.
I use session variables to hold the values.
Server Event
All Pages>User_Validated
Session("Region") = rs("Region")
Session("ShipAddress") = rs("Address")
Session("ShipCity") = rs("City")
Session("ShipSt") = rs("St")
Session("ShipZip") = rs("Zip")
I also get some values from another table when the user logs in.
Set rs = Conn.Execute("SELECT tblShipcharge.* FROM tblShipcharge;")
Session("2Day") = rs("2Day")
Session("Overnight") = rs("Overnight")
Session("Ground") = rs("Ground")

These values can then be used anwhere on the site. For instance on an add page to fill in fields.
Server Event
Add/Copy Page>Page_DataRendering
Claim.Region.EditValue = Session("Region")
Claim.Address.EditValue = Session("Address")
Claim.City.EditValue = Session("City")
Claim.ShipVia.EditValue = Session("Ground")

Example 2
Change the default table/View caption
Server Event
Page_Load
View/Table.TableCaption = "Whatever you want"

Example 3
Javascript alert on Edit page.
Scenario: A particular item needs to be checked to see if it is less than 90 days from the invoice date. If not, alert is raised.
Server Event
Edit Page>Page_DataRendering
If Claim.ClaimType.CurrentValue = "Supply" Then
If DateDiff("d",Cdate(Claim.InvoiceDate.EditValue), Cdate(Claim.DateOfDefect.EditValue)) > 90 Then
%><script type="text/javascript">
alert('Note: The supply item in this claim is more than 90 days from the invoice date.');
</script><%
End If
End If

Next...Some Javascript to hide show fields based on radio selections.

Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Wed Apr 02, 2014 7:51 pm

Javascript example.
I have an add page where the user has to select a type of claim. This determines what fields will be used on the page. The form is long so I don't want to
show fields that won't be used if a particular type of claim is selected. ClaimType is radio and is a mandatory field near the top of the form.
The javascript hides most of the fields on the form until a Claim Type is selected

Server Event
Client Scripts>Table-Specific>Add/Copy Page>Client Script
$(document).ready(function() {
//Initially hide fields until a claim type is selected.
$('#r_YourFieldName1').hide();
$('#r_YourFieldName2').hide();
$('#r_YourFieldName3').hide();
$('#r_YourFieldName4').hide();
$('#r_YourFieldName5').hide();
$('#r_YourFieldName6').hide();
//To switch fields depending on the Claim type selected.
$("input[name='x_ClaimType']").change(function(){
if ($("input[name='x_ClaimType']:checked").val() == 'Supply'){
$('#r_YourFieldName1').show();
$('#r_YourFieldName2').hide();
$('#r_YourFieldName3').show();
$('#r_YourFieldName4').hide();
$('#r_YourFieldName5').show();
$('#r_YourFieldName6').hide();
} else { //Hardware Selected
$('#r_YourFieldName1').hide();
$('#r_YourFieldName2').show();
$('#r_YourFieldName3').hide();
$('#r_YourFieldName4').show();
$('#r_YourFieldName5').hide();
$('#r_YourFieldName6').show();
} //End If Then
}); //End Input Change
}); //End Document Ready

Example 2
Custom form validation
Sometimes you don't want to make a field required unless another field is filled in or selected. Using the Custom Validate event will acomplish this.
Server Event
Add/Copy Page>Form_CustomValidate
If Warranty.ShipVia.FormValue = "2 Day" Or Warranty.ShipVia.FormValue = "Overnight" Then
If Warranty.PoNumber.FormValue = "" Then 'the field you want filled in if the user selects one of the Ship Via above.
Form_CustomValidate = False 'Don't submit and pop up the message
CustomError = "Please enter a PO Number. It can't be Blank"
ElseIf Warranty.AcceptUpcharge.FormValue = "" Then 'Another field you want filled in if the user selects one of Ship Via options above.
Form_CustomValidate = False 'Don't submit and pop up the message
CustomError = "Please type the word Yes in the Accept Upcharge box. It can't be Blank"
Else
Form_CustomValidate = True 'Let the form submit
End If
Else
Form_CustomValidate = True 'Let the form submit
End If

Example 3
Sometimes you want a field(Status) to to be a certain value after its edited.
I have a form with radio button(Status) that has values of 1,2, and 3. Approved(1), Entered(2), Need More Info(3) The processor can see this field. The user originally entering the information can't see the Status field.
The person processing the form selects Need More Info(3).
The original user that entered the values opens the form back up and adds the required information.
When the form is saved, you want the Status field to automatically be changed back to a 2(Entered) so it can be processed.
Server Event
Table Specific>Common>Row_Updating
If Page.PageID = "edit" Then
rsnew("Status") = 2 'This changes the 3(need more info) to a 2(Entered) when the record is edited and saved.
End If
Row_Updating = True


Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Fri May 09, 2014 5:08 am

Another example:
In a master/detail page the user wanted to see the master record when they edited or viewed the detail records.
The master table is not shown on these pages.
The code below will create a master table at the top of your detail record in the Edit or View pages
Server Event
Edit or view Page> Page_Data_Rendering
'Replace YourTableName with the name of your table or view.
Dim strSql
'Create your sql with the fields you want to see in your master table.
StrSql = "SELECT YourTableName.R12AccountNumber, YourTableName.CustomerName, YourTableName.Address, YourTableName.City, YourTableName.St, YourTableName.Zip, YourTableName.ContactName, YourTableName.Phone, YourTableName.EmailAddress FROM YourTableName WHERE ((YourTableName.DealerID)=" & HytecPcbApproval.DealerID.EditValue & ");"
Set rs = Conn.Execute(StrSql)
Response.Write("<table id=""t_YourTableName"" cellspacing=""0"" class=""ewGrid""><tr><td class=""ewGridContent"">")
Response.Write("<div class=""ewGridMiddlePanel"">")
Response.Write("<table id=""tbl_YourTableNamemaster"" class=""ewTable ewTableSeparate"">")
Response.Write("<thead>")
Response.Write("<tr>")
' These will match the fields in your sql statement. These are the headers in the table
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>Customer</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>Address</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>City</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>ST</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>Zip</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>Contact</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>Phone</td></tr></table></td>")
Response.Write("<td class=""ewTableHeader""><table class=""ewTableHeaderBtn""><tr><td>Email</td></tr></table></td>")
Response.Write("</tr>")
Response.Write("</thead>")
Response.Write("<tbody>")
Response.Write("<tr>")
' These will match the fields in your sql statement. This is the data in the table
Response.Write("<td>" & rs("CustomerName") & "</td>")
Response.Write("<td>" & rs("Address") & "</td>")
Response.Write("<td>" & rs("City") & "</td>")
Response.Write("<td>" & rs("St") & "</td>")
Response.Write("<td>" & rs("Zip") & "</td>")
Response.Write("<td>" & rs("ContactName") & "</td>")
Response.Write("<td>" & rs("Phone") & "</td>")
Response.Write("<td><a href=mailto:" & rs("EmailAddress") & ">" & rs("EmailAddress") & "</a></td>")
Response.Write("</tr>")
Response.Write("</tbody>")
Response.Write("</table>")
Response.Write("<div")
Response.Write("</td>")
Response.Write("</tr>")
Response.Write("</table>")

Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Wed Jun 04, 2014 7:47 pm

Email link at the bottom of your form.
I was recently asked to create an email link on a .add page that the users can click on that would take information from the form and populate an email in their default email client. They would click this before clicking on the Add button.
This allows the user to add addresses, modify the subject or body before sending.
Here is the code:
Server Event
Add/Copy Page>Page_DataRendered
%>
<script>
function SendLinkByMail(href) {
var subject= "Your recent support visit on ";
subject += document.getElementById('x_ServiceDate').value; //Start subject text string with the service date
subject += " for "; // add plain text
subject += document.getElementById('x_Result').value; //Add another field to the subject
subject += " on " // add plain text
subject += document.getElementById('x_ProductCategory').value; //End subject text
// Subject would look like this: Your recent support visit on 06/04/2014 for Damage Issues on Printer
var body = document.getElementById('x_Notes').value; //This field is used to populate the body of the email
var uri = "mailto:"
uri += document.getElementById('x_EmailAddress').value;
uri += "?subject=";
uri += encodeURIComponent(subject);
uri += "&body=";
uri += encodeURIComponent(body);
window.open(uri);
}
</script>
<br />
<a href="javascript:(function()%7BSendLinkByMail()%3B%7D)()%3B">YourLinkTextHere</a>
<%
The x_XxxxXxx's are the field names you want to use in your email.
This link will appear right below the Add button.
Although not tested, it should also work on the Edit page
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Wed Jul 16, 2014 6:47 pm

Here is a simple javascript alert(pop-up) when the user selects a radio button value.
Server Event
Client Scripts>Edit (or Add) Page>Client Script
$(document).ready(function() { //Begin Document Ready
$('input[name=x_Participate]').click(function() {//This is the name of your radio button.
if ($(this).val()=='No') { //No is the value of the button you want the message to be triggered on.
jAlert('By clicking No, you will not be eligible for the service award');
}//End Function
})//End Participate
});//End Document Ready
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Wed May 20, 2015 6:41 pm

Here is a list of modifications and events I've been compiling - Enjoy

Add headers for View,Edit,Copy,Delete
List page>ListOptions_Load
ListOptions.GetItem("view").Header = "View"
ListOptions.GetItem("view").CssStyle = "text-align:center;"
ListOptions.GetItem("edit").Header = "Edit"
ListOptions.GetItem("edit").CssStyle = "text-align:center;"
ListOptions.GetItem("copy").Header = "Copy"
ListOptions.GetItem("copy").CssStyle = "text-align:center;"
ListOptions.GetItem("delete").Header = "Delete"
ListOptions.GetItem("delete").CssStyle = "text-align:center;"
ListOptions.GetItem("detail_qryAllChamps").Header = "Click<br>or<br>Hover"
ListOptions.GetItem("detail_qryAllChamps").CssStyle = "text-align:center; white-space: nowrap;"
‘Hide a column on the list page.
ScmUsers.Address.Visible = False 'Hide the address column

For Option buttons group(using button instead of text) V12
ListOptions.GetItem(ListOptions.GroupOptionName).Header = "YourTextHere"
ListOptions.GetItem(ListOptions.GroupOptionName).CssStyle = "text-align:center;"

Remove the Action button from the view page.
In Page_Render server event of view page, add:
ActionOptions.HideAllOptions(Array())

Hide a button (AdvancedSearch)
Client Scripts>Global>List Page>Startup Script
$(".btn.ewAdvancedSearch").hide();
$(".btn.ewShowAll").hide();

Hide the breadcrumb on a specific page
Client Scripts>Global>Table-Specific>Startup Script
$("ul.breadcrumb").hide();

Don’t show any Breadcrumbs
Add to User styles in CSS
.breadcrumb {
display: none;
}

To change table header
List Page>Page_Load
Table.Field.FldCaption = "YourTextHere"

To change export link
To change the export link, use the following codes in Page_Load server event:
ExportOptions.GetItem("excel").Body = "<a href="{new link}">{new caption}</a>"

Change a table caption
Warranty.TableCaption = "Warranty(Claim Date <60)"

To color code rows
Table-Specific>Common>Row_Rendered
If Approved.ViewValue = " Approved" Then
tblClaims.CssStyle = "background-color: #FF6600"
ElseIf Approved.ViewValue = "Entered" Then
tblClaims.CssStyle = "background-color: #FFFF00"
ElseIf Approved.ViewValue = " Declined" Then
tblClaims.CssStyle = "background-color: #FF0000"
ElseIf Approved.ViewValue = "Need More Info" Then
tblClaims.CssStyle = "background-color: #00CCFF"
End If

'For the View/Edit/Add/Delete links on the View page V9
If CurrentPageID() = "view" Then
If tblClaims.Approved.ListViewValue = "Entered" Then
Security.CanEdit = True
Security.CanDelete = True
ElseIf tblClaims.Approved.ListViewValue = "Need More Info(see comments)" Then
Security.CanEdit = True
Security.CanDelete = True
Else
Security.CanEdit = False
Security.CanDelete = False
End If
Security.CanAdd = False
End If

End Sub

To create session variables from user table
Global>All Pages>User_Validated
'Session("UserEmail") = rs("Email")
Session("OracleAccount") = rs("AccountNumber")
Session("ManagerEmail") = rs("ManagerEmail")
Session("CustNumber") = rs("CustomerNumner")
Session("City") = rs("City")
End Sub

Use session variables to populate fields
Table-Specific>Add/Copy Page>Page_DataRendering
' Page Data Rendering event
Sub Page_DataRendering(header)
' Example:
'header = "your header"
tblClaims. Email.EditValue = Session("Email")
tblClaims. AccountNumber.EditValue = Session("OracleAccount")
tblClaims.NSPNumber.EditValue = Session("NspNumber")
End Sub

Field Alignment on Add Page
Table-Specific>Add/Copy Page>Page_DataRendering
' Page Data Rendering event
Sub Page_DataRendering(header)
' Example:
'header = "your header"
<table>.<field>.CellCssStyle = "text-align:left;"
End Sub

Header Alignment on List page V12
Client Scripts>List Page>Startup Script
$("#elh_<Table>_<Field>").closest("th").css("text-align", "center");

Field Alignment on Edit Page
Table-Specific>Edit Page>Page_DataRendering
' Page Data Rendering event
Sub Page_DataRendering(header)
' Example:
'header = "your header"
<table>.<field>.CellCssStyle = "text-align:left;"
End Sub

Field Alignment on View Page(Ver10+ Add Cell before CssStyle)
Table-Specific>View Page>Page_DataRendering
Sub Page_DataRendering(header)
' Example:
'header = "your header"
<table>.<field>.CellCssStyle = "text-align:left;"
<table>.<field>.CellCssStyle = "text-align:left;"
End Sub

To load a certain page after login
Other>Login Page>User_LoggedIn
' User Logged In event
Sub User_LoggedIn(usr)
' Response.Write "User Logged In"
response.Redirect("tblUserslist.asp")
End Sub

Redirect user level to certain page
If CurrentUserLevel = 7 Then
response.Redirect("rdefault.asp") 'reports
ElseIf CurrentUserLevel = 12 Then
response.Redirect("MasterUserslist.asp")
Else
response.Redirect("tblUserslist.asp")
End If

Hide Add, Edit Copy, etc links on View page
View> Page_Render
ActionOptions.GetItem("edit").Visible = False ' Hide edit link

Make "Start With" to be default search option and the other operators to be available
Set your field "Search Opr 1" as USER SELECT. Add code in Client Scripts->Table-Specific->List Page->Startup Script if you want to change in extended search for your list page:
$('#z_<yourfield> option[value="STARTS WITH"]').prop("selected",true);
Ver 12
$('#z_policy option[value="LIKE"]').prop("selected",true);

Column Header Background color
Page_Load
<table>.<field>.FldCaption ="<span style='color: #000000; background-color: #FF00FF'> Developer Lot</span>"
<table>.<field>.FldCaption ="<span style='color: #000000; background-color: #33CC33'>Claim Status</span>"

Center a checkbox on a list page
TableSpecific>Common>Row_Rendered
<table>.<field>.CellCssStyle = "text-align:center;"

To Remove icons on list page V12
To remove buttons from preview window
opt.Body = opt.Body & "<div class=""hide ewPreview"">" & link & btngrp & "</div>"
Change to:
opt.Body = opt.Body & "<div class=""hide ewPreview"">" & link & "</div>"

To adjust Edit tooltip text
If you mean the field edit title (which use actual bootstrap tooltip), use:
Add to User styles in CSS
.tooltip > .tooltip-inner {
/* your custom css */
}

To adjust View tooltip text
The codes we suggested are referring to [View Tag] -> [Tooltip field].
#ewTooltip .popover-content {
/* your custom styles */
}
Change Button text size
Add to User styles in CSS
.btn-sm,
.btn-group-sm > .btn {
/* your custom styles */
}

Change Tooltip position
Custom Attributes in Edit tag area. Add "data-placement='right'"

Change Form row spacing
Add to User styles in CSS
.form-group {
margin-bottom: 5px;
}

Menu item color
To update the font color of the menu item, you can update the css of the item in Global "Startup Script"

For example:
$("#mi_<Table> > a").css("color","<Color>"); // Update <Table> and <Color> with actual value.
EG. $("#mi_HotlineMetrics > a").css("color","#9c9ab7");

Reports
To move filter icon to the left in crosstab reports, add this to the report startup script
$('.ewTableHeaderPopup').each(function(){
$(this).prependTo($(this).parent()).css("left",0);
$(this).parent().find('.ewTableHeaderCaption').css("margin-left","12px");
});
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby yinsw » Fri Sep 04, 2015 10:18 am

Thank you ready4data. Very useful information indeed.
yinsw
 
Posts: 71
Joined: Wed Aug 19, 2015 4:17 pm

Re: Row_Rendered Server Event Examples

Postby alex » Thu Sep 10, 2015 6:57 pm

Very nice topic and usefull information! Thank you!
alex
 
Posts: 113
Joined: Wed Mar 12, 2014 11:15 pm

Re: Row_Rendered Server Event Examples

Postby dellcentro » Sun Jan 31, 2016 1:24 am

Dear your post are very helpful to new user like me.
i have two table meter (meter id primary key, meter name), second table detail table meter reading ( readingid primary key, meter id, reading value).
in grid page i am able to populate the number of rows as number of meter in meter table by using following code.

Table specific list page server event
Dim MyCount
MyCount = ew_ExecuteScalar("SELECT COUNT(*) FROM <mastertablename>")
<Childtablename>.GridAddRowCount= MyCount
dellcentro
 
Posts: 20
Joined: Tue Mar 25, 2014 6:44 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Fri Apr 01, 2016 7:46 pm

How about some Ajax?
Been a while since I posted here so I hope you find this useful.
Scenario: Needed a field on an edit.asp page where the user could hover over a field and get a pop-up with a message and a url to click on based on data from a separate database that is uploaded daily with current information. The edit.asp page contains a field with a number that is used as a lookup in the other database. The ajax call returns the data based on the lookup value. For the pop-up I used a jquery library(jalert) that isn't available anymore but any alert library should work fine. Even just the jquery alert will work. Now for the code.
You need to create an asp page that is used for the lookup. The lookup field is called CaseNumber so I named the asp page case.asp
This is the code for that page. The Warranty.mdb contains a table tblCaseToId. The table CaseToId contains two fields CaseNumber(the lookup field) and Link(a url that will be clicked on)
<%
'declare the variables
Dim Connection
Dim Recordset
Dim SQL
Dim caseNumber
Dim EW_DB_CONNECTION_STRING

caseNumber = Request("caseNumber") ' from jquery ajax GET URL

EW_DB_CONNECTION_STRING = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath("Warranty.mdb") & ";"
sql = "SELECT tblCaseToId.Link as RecallId FROM tblCaseToId WHERE (((tblCaseToId.CaseNumber)='" & caseNumber & "'));"
'create an instance of the ADO connection and recordset objects
Set Connection = Server.CreateObject("ADODB.Connection")
Set Recordset = Server.CreateObject("ADODB.Recordset")
'open the connection to the database
Connection.Open EW_DB_CONNECTION_STRING
'Open the recordset object executing the SQL statement and return records
Recordset.Open SQL,Connection
If not Recordset.EOF Then
Response.Write Recordset.Fields("RecallId") 'this is what is passed to the ajax call
Else
Response.write "Manually check the Recall database" 'this is passed if no records are found.
End If
%>
Now for the ASPM generated edit.asp page.
In the Server Events for the table or view. Client Scripts>Table Specific>Edit Page>Client Script
$(document).ready(function() {
//ajax code to lookup Recall caseCheck number. uses case.asp file
$("input[name='x_CaseNumber']").mouseenter(function(){ //This is the field that the user would hover over to get the information
var caseCheck = $(this).val(); //the number(string) of the data in the field
$.ajax({url:'/warranty/case.asp', type:'GET', data:{caseNumber : caseCheck}, success:function(msg) {
if(msg!="Manually check the Recall database"){ //If the value is found, return the msg string which is the url from the remote database
jAlert('Click the link below to open the Recall Claim<br><a href="' + msg + ' "target = _blank"">Recall Case</a>', 'Recall Information'); //This is the alert pop-up that contains a clickable url
} else {
jAlert('Sorry, I can not fine this claim number.<br>Click the link below, login, and search for the case number.<br><a href="h__ps://aWebsite.com "target = _blank"">Recall Login</a>', 'Recall Information');
}
}
});
});
});//End Document ready

Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Tue Apr 19, 2016 7:21 pm

Floating headers. Now this is really cool!!

By using a free jquery library and 8 lines of code, you can now float the heaters when scrolling down the page of a large table. When the header gets to the top of the page as you scroll down, it now stays there letting you see it as you scroll down to the bottom of your table. This also works In the Grid edit mode.

First download the library at h__p://mkoryak.github.io/floatThead/ The download button is near the bottom of the page.
After you unzip, go to the dist folder and copy the jquery.floatThead.min.js file and place it in the jquery folder of your generated project.
You have to create a reference to this library on your header page. Easiest way to do this is to place the following line in server events(Global>All Pages>Page_Head)
Response.Write"<script type=""text/javascript"" src=""jquery/jquery.floatThead.min.js""></script>"
Generate the header.asp page again.

Now for the hard part.
Copy these 8 lines of code:
$(document).ready(function(){
var $table = $('#tbl_<table>'); //Replace <table> with the name of your table
$table.floatThead({
scrollContainer: function ($table) {
return $table.closest('.wrapper');
}
});
});

On the list.asp page where you want the header to float, paste this code in Client Scripts>Table-Specific>List Page>Startup Script
Generate the list page again. That's it...

Enjoy,
Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Thu May 11, 2017 1:46 am

Its been a while so....
Collapsing columns on a wide list page.
One of my list pages has 20 columns. The headers are colored in groups to make them more identifiable.
I was asked if I could collapse some of them to save space.
They basically wanted the first column in a section so show and when clicked on, open or close the other ones in the group.
I did this using javascript.
1. In the /*BEGIN_USER_STYLES*/ section of the Styles tab add this.
.hidden { display: none }
2. In ver 2017 uncheck the sort option in the field setup for the column you want to click on. You don't want it sorting while collapsing.
3.In the Client Script section for the list page add this
$(document).ready(function() {
$(document).on("click", "[data-name]", function () {
var button = $(this)
var item = this.textContent.replace(/(\r\n|\n|\r)/gm,'');
if (item === '<Field header caption>'){ //the column header you want to make clickable to toggle the others.
$("th[data-name='<field1>']").toggleClass("hidden");// first column you want to toggle(header)
$("td[data-name='<field1>']").toggleClass("hidden"); //first column you want to toggle(data)
$("th[data-name='<field2>']").toggleClass("hidden"); //second column you want to toggle(header)
$("td[data-name='<field2>']").toggleClass("hidden"); //second column you want to toggle(data)
$("th[data-name='<fieldn>']").toggleClass("hidden"); //n column you want to toggle(header)
$("td[data-name='<fieldn>']").toggleClass("hidden"); //n column you want to toggle(data)
}
//copy from if to } above to add another group
});
});
That's it.
If you want the columns initially collapsed, just add the lines to the Startup Script section of the list page
$(document).ready(function() {
$("th[data-name='<field1>']").toggleClass("hidden");// first column you want to toggle(header)
$("td[data-name='<field1>']").toggleClass("hidden"); //first column you want to toggle(data)
$("th[data-name='<field2>']").toggleClass("hidden"); //second column you want to toggle(header)
$("td[data-name='<field2>']").toggleClass("hidden"); //second column you want to toggle(data)
$("th[data-name='<fieldn>']").toggleClass("hidden"); //n column you want to toggle(header)
$("td[data-name='<fieldn>']").toggleClass("hidden"); //n column you want to toggle(data)
});

One other thing I did was to add <br />>> to the caption for the fields that can be clicked on just to identify them better.
This put a >> under the header text.
If you do this, don't forget to modify the if line. Example.
if (item === 'Products'){ //the column header you want to make clickable to toggle the others.
would become
if (item === 'Products>>'){ //the column header you want to make clickable to toggle the others.

Have Phun
Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Tue Nov 14, 2017 9:58 pm

Here are some new items for V2018
Move the logout icon(person) to the left.
Add this to CSS User Styles.
.main-header .navbar-custom-menu,
.main-header .navbar-right {
float: left;
}

Change the menu item padding.
Add this to CSS User Styles.
.sidebar-menu > li > a {
/*Your Modified items below*/
padding: 5px 5px 5px 15px;
display: block;
}

Restore the horizontal scrollbar site-wide.
Add this to CSS User Styles.
.content {
overflow-x: scroll;
}

Restore the scrollbar for individual list pages.
List Page>Startup script
$(document).ready(function(){
overFlow();
});
$(window).resize(function() {
overFlow();
});
function overFlow(){
var pageWidth = $(".content-wrapper").width();
var elementName = '#fYourTableNameHerelist' //Your table name #f<table>list
var elementWidth = $(elementName).width();
var elementLeft = $(elementName).position().left;
if (pageWidth - (elementWidth + elementLeft) < 0) {
$('.content').css({
overflowX: 'scroll'
});
} else {
$('.content').css({
overflowX: 'auto'
});
}
}

Icons for the menu(Icon Class Name in the menu editor)items.
h__p://fontawesome.io/icons/

Enjoy,
Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm

Re: Row_Rendered Server Event Examples

Postby ready4data » Thu Feb 01, 2018 8:40 pm

A few more tweeks for V2018
If you use the Font Awesome icons in your menu, you might want to collapse the menu to just those icons using the hamburger icon at the top.

Startup on a specific page or globally
List Page>Startup script
$("body").addClass("sidebar-mini");

You can Initially collapsed to the fa icons when a page opens.
List Page>Startup script
$("body").addClass("sidebar-mini sidebar-collapse");

Moving breadcrumbs to the left .
Add to user styles in the css. You can also add any other styling for the breadcrumbs here.
.content-header >.breadcrumb {
position: relative;
padding: 5px 0 5px 0;
background: transparent;
margin: 0;
/*font-size: 14px;
font-weight: bold;*/
}

Remove the table header name from the top of the page(s)
Add to user styles in the css.
.content-header h1 {
display: none;
}

Scott
ready4data
 
Posts: 280
Joined: Mon Nov 19, 2012 8:24 pm


Return to User Submitted Tips (ASPMaker)