Reach router <Router>: Children of <Router> must have a `path` - path

i want to read the url in the clientProvider and then render the rest of the app but it throws this error :
: Children of must have a path or default prop, or be a <Redirect>. None found on element type [object Object]
Here are my 2 classes
App.js
<LocationProvider>
<Router basepath={process.env.PUBLIC_URL}>
<ClientProvider path="/:clientID">
<CssBaseline />
<AuthProvider>
<UserProvider>
<BusinessLog path="/" />
<VisitorLog path="visitorLog" />
<VisitorAccess path="visitorAccess" />
<DataAccess path="dataaccess" />
</UserProvider>
</AuthProvider>
</ClientProvider>
</Router>
</LocationProvider>
And the CLientProvider after reading the url
return loadingClient ? (
<div className={classes.root}>
<CircularProgress />
</div>
) : (
<ThemeProvider theme={theme}>
<ClientContext.Provider value={client}>{props.children}</ClientContext.Provider>
</ThemeProvider>
);


// instead of this
<Redirect from="/" to="/home" />
// do this
<Redirect path="/" to="/home" />

Related

UI5 odata failed to drill down

Hello i set the binding context for an oData request, and the request is called fine.
But on ui5, i get the following error:
Failed to drill-down into Id, invalid segment: Id - ../oData/Users('44ce4852-5985-44c3-9a75-03e252747d29')?$select=Email,FirstName,Id,LastName,UserName sap.ui.model.odata.v4.lib._Cache
Controller:
onInit: function () {
this.getRouter().getRoute("userDetails").attachPatternMatched(this._onObjectMatched, this);
},
_onObjectMatched: function (oEvent) {
var sUserId = oEvent.getParameter("arguments").userId;
console.log(sUserId);
this.getView().bindElement({
path: "/Users('"+sUserId+"')",
model: "som"
});
console.log(sUserId);
},
View:
<Page >
<fLayout:SimpleForm editable="true"
layout="ResponsiveGridLayout"
title="{i18n>settings.user.title}"
labelSpanXL="3"
labelSpanL="3"
labelSpanM="3"
labelSpanS="12"
emptySpanXL="4"
emptySpanL="4"
emptySpanM="4"
emptySpanS="0"
columnsXL="1"
columnsL="1"
columnsM="1" >
<fLayout:content>
<Label text="{i18n>settings.user.id}" />
<Input editable="false" value="{som>Id}" />
<Label text="{i18n>settings.user.userimage}" />
<f:Avatar press="onAvatarPressed" imageFitType="Contain" displaySize="XL" />
<Label text="{i18n>settings.user.username}" />
<Input value="{som>UserName}" />
<Label text="{i18n>settings.user.email}" />
<Input value="{som>Email}" />
<Label text="{i18n>settings.user.firstname}" />
<Input value="{som>FirstName}" />
<Label text="{i18n>settings.user.lastname}" />
<Input value="{som>LastName}" />
</fLayout:content>
</fLayout:SimpleForm>
</Page>

I found the solution, my request was returning a list ant not a single object.

react-router 2.8 Link to add path instead of replace

I am try to make pagination with react-router and redux.
To simplify the situation, I removed my paginator and left only News component.
I have the same problem. When I push button Route adds to path. And path looks like 'http://localhost:3000/news/page/news/page/news/page/4'.
import React, { Component } from 'react'
import { Link } from 'react-router'
export default class News extends Component {
render() {
let nextPage = + (this.props.params.page || 1);
return(
<div>
<h1>I am on {nextPage}</h1>
<ul>
<li><Link to='news/page/2'>Page2</Link></li>
<li><Link to='news/page/3'>Page3</Link></li>
<li><Link to='news/page/4'>Page4</Link></li>
</ul>
</div>
)
}}
export const routes = (
<div>
<Route path='/' component={App}>
<IndexRoute component={Home}/>
{/*}<IndexRedirect to='list' />*/}
<Route path='/news(/page/:page)' component={News}/>
<Route path='/admin' component={Admin} onEnter={Admin.onEnter}/>
<Route path='products' component={Products}/>
<Route path='contacts' component={Contacts}/>
<Route path='about' component={About} />
<Route path='login' component={LoginPage} />
<Route path='orders' component= {Orders}/>
<Route path='signup' component={SignupPage}/>
<Route path='validateEmail' component= {requireIdentification(ValidateEmail)}/>
<Route path='/verifyEmail/:token' component={CheckEmail}/>
</Route>
<Route path='*' component={NotFound} />
</div>
)

The decision is
<li><Link to='/news/page/2'>Page2</Link></li>
instead of
<li><Link to='news/page/2'>Page2</Link></li>

Expand/Collapse not working in Telerik RadGrid

I am using Telerik RadGrid with NestedViewTemplate to display data in my MVC applicaiton.
Following is my code
<telerik:RadGrid ID="rgNutritionLog" runat="server" OnInit="rgNutritionLog_Init"
OnNeedDataSource="rgNutritionLog_NeedDataSource" OnPreRender="rgNutritionLog_PreRender" OnItemCommand="rgNutritionLog_ItemCommand" OnItemDataBound="rgNutritionLog_ItemDataBound"OnItemCreated="rgNutritionLog_ItemCreated">
<GroupingSettings CaseSensitive="false" />
<HeaderStyle Width="120px" CssClass="tableHeader" />
<ClientSettings AllowColumnsReorder="true" AllowExpandCollapse="true">
<Selecting AllowRowSelect="true" />
<Scrolling AllowScroll="true" UseStaticHeaders="true" FrozenColumnsCount="1" />
<ClientEvents OnGridCreated="GridCreated" OnHeaderMenuShowing="HeaderMenuShowing" />
</ClientSettings>
<HeaderContextMenu OnClientItemClosed="OnClientItemClosed" OnItemCreated="HeaderContextMenu_ItemCreated"
OnClientItemOpening="OnClientItemOpening" BackColor="AliceBlue" BorderColor="Black">
</HeaderContextMenu>
<MasterTableView AllowFilteringByColumn="true" ShowFooter="false" ClientDataKeyNames="ID"
DataKeyNames="ID" TableLayout="Fixed">
<Columns>
<telerik:GridBoundColumn DataField="ID" HeaderText="ID"
ShowFilterIcon="false" UniqueName="intFunctionalTestId" SortExpression="ID"
FilterControlWidth="100px" AutoPostBackOnFilter="true" CurrentFilterFunction="Contains"
Visible="false">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn DataField="AthleteName" HeaderText="Athlete Name"
ShowFilterIcon="false" UniqueName="AthleteName" SortExpression="AthleteName"
FilterControlWidth="100px" AutoPostBackOnFilter="true" CurrentFilterFunction="Contains"
Visible="true">
<ItemTemplate>
<%#Eval("AthleteName") %>
</ItemTemplate>
<HeaderStyle Width="120px" />
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="EnergyIncludingDietaryKjProposed" HeaderText="Proposed Energy Including Dietary Fibre (Kj)" ShowFilterIcon="true"
UniqueName="EnergyIncludingDietaryKjProposed" SortExpression="EnergyIncludingDietaryKjProposed" FilterControlWidth="80px"
AutoPostBackOnFilter="false" CurrentFilterFunction="NoFilter">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="EnergyIncludingDietaryKjActual" HeaderText="Actual Energy Including Dietary Fibre (Kj)" ShowFilterIcon="true"
UniqueName="EnergyIncludingDietaryKjActual" SortExpression="EnergyIncludingDietaryKjActual" FilterControlWidth="80px"
AutoPostBackOnFilter="false" CurrentFilterFunction="NoFilter">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="CarbohydrtProposed" HeaderText="Proposed Carbohydrates (g)" ShowFilterIcon="true"
UniqueName="CarbohydrtProposed" SortExpression="CarbohydrtProposed" FilterControlWidth="80px"
AutoPostBackOnFilter="false" CurrentFilterFunction="NoFilter">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
</Columns>
<NestedViewSettings>
<ParentTableRelation>
<telerik:GridRelationFields DetailKeyField="ID" MasterKeyField="ID" />
</ParentTableRelation>
</NestedViewSettings>
<NestedViewTemplate>
<div style="overflow-y: scroll;">
<fieldset style="padding: 2px;">
<telerik:RadGrid ID="rgAssignedDetails" AutoGenerateColumns="false" runat="server"
AllowSorting="true" OnNeedDataSource="rgAssignedDetails_NeedDataSource">
<ClientSettings AllowColumnsReorder="true">
</ClientSettings>
<MasterTableView>
<Columns>
<telerik:GridBoundColumn DataField="Meal" HeaderText="Meal" UniqueName="Meal">
<HeaderStyle Width="150px" />
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="EnergyIncludingDietaryKjProposed" HeaderText="Proposed Energy Including Dietary Fibre (Kj)"
UniqueName="EnergyIncludingDietaryKjProposedMeal">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="EnergyIncludingDietaryKjActual" HeaderText="Actual Energy Including Dietary Fibre (Kj)"
UniqueName="EnergyIncludingDietaryKjActual">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="CarbohydrtProposed" HeaderText="Proposed Carbohydrates (g)"
UniqueName="CarbohydrtProposed">
<HeaderStyle Width="120px" />
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
Any suggestion?
How can I do Expand/Collapse? Also is there any way to make nested grid scroll able?

I could not perform expand/collapse from server side so I did it using javascript following is the solution
var imageButtonPath = null;
function RowClicked(sender, eventArgs) {
var grid = sender;
var rowIndex = eventArgs.get_itemIndexHierarchical();
if (rowIndex.indexOf(':') != -1) {
rowIndex = rowIndex.substr(rowIndex.lastIndexOf('_') + 1);
}
var tableView = eventArgs.get_tableView();
var row = tableView.get_dataItems()[rowIndex];
if (tableView.getCellByColumnUniqueName(row, "ExpandColumn")) {
if (row.get_expanded() == false) {
row.set_expanded(true);
imageButton = tableView.getCellByColumnUniqueName(row, "ExpandColumn").childNodes[0];
imageButton.className = "rgCollapse";
}
else {
row.set_expanded(false);
imageButton = tableView.getCellByColumnUniqueName(row, "ExpandColumn").childNodes[0];
imageButton.className = "rgExpand";
}
}
GridCreated(sender, eventArgs)
}
I called this javascript function on row click event.

Indexed properties are getting duplicated struts2 on form submission

I need to add/edit/delete the table of objects in struts2. When I submit the form, I am getting objects duplicated.
Let me know where I made a mistake.
This is my code:
<s:form action="addPromotionLineItems" id="promotionLineItemsAddFormId">
<display:table id="data"
name="lstPromotionLineItems" sort="external" uid="row" htmlId="rowid"
class="tborder" excludedParams="*" style="width:100%" export="false">
<display:column titleKey="table.title.material" style="width:100px">
<s:property value="%{#attr.row.materialCode}" />
<s:hidden
name="lstPromotionLineItems(%{#attr.row_rowNum-1}).promotionLineItemId"
value="%{#attr.row.promotionLineItemId}" />
<s:hidden
name="lstPromotionLineItems(%{#attr.row_rowNum-1}).materialCode"
value="%{#attr.row.materialCode}" />
<s:hidden
name="lstPromotionLineItems(%{#attr.row_rowNum-1}).material.description"
value="%{#attr.row.material.description}" />
<s:hidden
name="lstPromotionLineItems(%{#attr.row_rowNum-1}).programId"
value="%{#attr.row.programId}" />
</display:column>
<display:column property="material.description"
titleKey="table.title.materialdesc" />
</s:form>
function refreshTableRecords(url,formNameId,resultId)
$.ajax({
type:'POST',
url: url,
data:$('#'+formNameId).serialize(),
success : function(response) {
$('#'+resultId).html(response);
},
error:function(data)
{
alert(data);
}
});
}
I have this content in jQuery ui modal popup.

I think when mapping to collection data in struts the syntax is not:
name="lstPromotionLineItems(%{#attr.row_rowNum-1}).promotionLineItemId"
rather:
name="lstPromotionLineItems[%{#attr.row_rowNum-1}].promotionLineItemId"
There is a slight difference in the bracketing around the row_num attribute in the input name.

Struts2 pagination

My Struts2 application needs the pagination functionality applied to some records, but what I need to customize is the "Last 1 - 2 - 3 Next" appearance and also have the ability to use a combo box for the selection of how many records should be visible(10 - 20 - 30 - 40 -50).
I have tried two way to accomplish this goal:
1) use display tag library, but I'm not able to customize the appearance, because is auto-generated by the library, and I don't how implement the combo box for select how many records should be visible
2) create my own code for accomplish this functionality but is a job too long and not enough time due to the expiry.
My question is: exists some Struts2 library for realize this functionality? Or, is possible to customize the display tag library for the page scroll bar and the records combo box?

I can give insight from struts2 code base there is no functionality as described by you provided by struts2 in itself..
Regarding the Display tag i have not used them much but since they are the part of oprn source i am sure we can customize that one more thing regarding the customization of display tag ask question under display tag you will get better answer at at quick pace

I wrote a custom tld just for the purpose as below and then just use it like this:
Usage:
paginate.tag
1}">
<c:set var="showingPage"
value="${param.pageNumber == null ? 1 : param.pageNumber}" />
<c:url value="${postUrl}" var="previousUrl">
<c:param name="pageNumber" value="${showingPage - 1}" />
<c:param name="perPage" value="${perPage}" />
</c:url>
<c:url value="${postUrl}" var="nextUrl">
<c:param name="pageNumber" value="${showingPage +1}" />
<c:param name="perPage" value="${perPage}" />
</c:url>
<div class="pagination" />
<c:if test="${showingPage > 1}">
<< Previous
</c:if>
<fmt:formatNumber var="endCounter" pattern="0">
<%= totalCount % perPage > 0 ? Math.ceil(totalCount/perPage) + 1 : totalCount/perPage %>
</fmt:formatNumber>
<c:forEach begin="1" end="${endCounter}" var="index">
<c:url value="${postUrl}" var="url">
<c:param name="pageNumber" value="${index}" />
<c:param name="perPage" value="${perPage}" />
</c:url>
${index}
</c:forEach>
<c:if test="${endCounter != showingPage}">
Next >>
</c:if>
</div>
</c:if>

hi you can try struts2 jquery grid here is the code
<%# page contentType="text/html; charset=UTF-8"%>
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sj" uri="/struts-jquery-tags"%>
<%# taglib prefix="sjg" uri="/struts-jquery-grid-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<sj:div id="resultsDiv">
<body>
<div id="mainframe">
<s:form>
<div id="sucessMsg">
<s:property value="msg" />
</div>
<s:url id="editurl" action="editUser" />
<s:url id="deleteurl" action="deleteUser" />
<script type="text/javascript">
function editLinkFormatter(cellval, options, rowObject, icon, link_class, link_action) {
//alert(rowObject.username);
return "<a href='#' onClick='javascript:openEditDialog(""+cellval+"",""+rowObject.username+"")'><font class='hyperlink'><u>" + rowObject.username + "</u></font></a>";
}
function deleteLinkFormatter(cellval, options, rowObject, icon, link_class, link_action) {
return "<a href='deleteUser?userid="+cellval+"' onClick='javascript: return delete_user()'><font class='hyperlink'><u>Delete</u></font></a>";
//return "Delete";
}
colModal: [
{name: 'userid', formatter: function (cellvalue, options, rowObject) {
return editLinkFormatter(cellvalue, options, rowObject,
'ui-icon-pencil', 'edit-link-class', 'Edit');
}},
{name: 'userid', formatter: function (cellvalue, options, rowObject) {
return deleteLinkFormatter(cellvalue, options, rowObject, icon, link_class, link_action);
}}
];
function openEditDialog(userid,username) {
$("#resultsDiv").load("<s:property value="editurl"/>?userid="+userid+"&username="+username);
}
function delete_user() {
var agree=confirm("Are you sure you want to Delete?");
if (agree){
return true;
}
else{
return false;
}
// $("#edit_Users").dialog('open');
}
function unlockerFormatter(cellval, options, rowObject, icon, link_class, link_action) {
if(rowObject.loginStatus=='Locked'){
return "<a href='unlockuser?userid=" + rowObject.userid + "')'><font class='hyperlink'><u>Locked</u></font></a>";
}
else{
return "UnLocked";
}
/* return "<a href='deleteUser?userid="+cellval+"' onClick='javascript: return deleteUser("+cellval+")'><u>Delete</u></a>"; */
//return "Delete";
}
</script>
<sj:dialog id="edit_Users" title="Edit User" autoOpen="false"
modal="true" width="800" />
<sj:div id="draggable" draggable="true">
<s:url id="remoteurl" action="viewUserstemp" />
<sjg:grid id="gridtable" caption="Users" dataType="json"
href="%{remoteurl}" pager="true" gridModel="gridModel"
rowList="10,15,20,50,100" rowNum="10" rownumbers="true" viewrecords="true"
width="800" navigator="true" navigatorView="false" navigatorDelete="false" navigatorAdd="false" navigatorEdit="false" navigatorSearch="false">
<sjg:gridColumn name="userid" index="userid" title="User Id"
sortable="false" />
<sjg:gridColumn name="userid" index="username" title="User Name"
sortable="true" formatter="editLinkFormatter" />
<sjg:gridColumn name="emailid" index="emailid" title="Email Id"
sortable="true" />
<sjg:gridColumn name="userCreatedDate" index="userCreatedDate"
title="Created Date" sortable="true" />
<sjg:gridColumn name="userModifiedDate" index="userModifiedDate"
title="Modified Date" sortable="true" />
<sjg:gridColumn name="accstatus" index="accstatus"
title="Account Status" sortable="true" />
<sjg:gridColumn name="userid" index="username" title="Delete User"
sortable="true" formatter="deleteLinkFormatter" />
<sjg:gridColumn name="loginStatus" index="loginStatus" title="Unlock User"
sortable="true" formatter="unlockerFormatter" />
</sjg:grid>
<br></br>
<s:submit action="loadUserValues" cssClass="ui-button ui-widget ui-state-default ui-corner-all ui-state-hover" name="button"
id="button" value="New User" />
<br />
</sj:div>
</s:form>
<%--
<td height="25" align="left" valign="middle">
<s:url id="url" action="unlockuser">
<s:param name="userid">
<s:property value="userid" />
</s:param>
</s:url>
<s:set name="type" value="%{loginStatus}" />
<s:if test="%{#type=='Locked'}">
<s:a href="%{url}" title="Click here to Unlock" ><s:property value="loginStatus"/></s:a>
</s:if>
<s:else>
Unlocked
</s:else> --%>
</td>
</div>
</body>
</sj:div>
</html>

Resources