Filling data in Ext.net FormPanel - model-view-controller

I am using Ext.net 2.0 and I am trying to load the first record of the store inside a form panel. I always get no records (getCount() = 0) in the store ? Am I missing something ?
#(Html.X().Store()
.ID("myStore")
.AutoSync(true)
.AutoDataBind(true)
.Proxy(proxy =>
proxy.Add(
Html.X().AjaxProxy().API(api =>
{
api.Create = "/Property/Save/";
api.Read = "/Property/GetById/";
})
.Reader(reader => reader.Add(Html.X().JsonReader().Root("data").IDProperty("P_ID")))
.Writer(writer => writer.Add(Html.X().JsonWriter().AllowSingle(true)))
))
.Listeners(c =>
{
c.DataChanged.Handler ="var store = Ext.getStore('myStore');" +
"alert(store.getCount());";
})
.AutoLoadParams(parameters =>
{
parameters.Add(Html.X().Parameter().Name("id").Value("document.location.href.split('/')[5]").Mode(ParameterMode.Raw));
})
.Model(model => model.Add(
Html.X().Model()
.Fields(fields =>
{
fields.Add(Html.X().ModelField().Name("ID").Type(ModelFieldType.Int));
fields.Add(Html.X().ModelField().Name("DispalyName").Type(ModelFieldType.String));
fields.Add(Html.X().ModelField().Name("Title").Type(ModelFieldType.String));
fields.Add(Html.X().ModelField().Name("ShortDescription").Type(ModelFieldType.String));
})
))
)
For the form panel
#(
Html.X().FormPanel()
.ID("myPanel")
.Layout(LayoutType.Form)
.Width(350)
.FieldDefaults(d => {
d.LabelWidth = 150;
})
.BodyPadding(10)
.Items(item =>
{
item.Add(Html.X().TextField().ID("Id").Name("ID").FieldLabel("Id").Hidden(true));
item.Add(Html.X().TextField().ID("DispalyName").Name("IdDispalyName").FieldLabel("Id Dispaly Name").MaxLength(400));
item.Add(Html.X().TextField().ID("Title").Name("Title").FieldLabel("Title").AllowBlank(false).MaxLength(200));
item.Add(Html.X().TextField().ID("ShortDescription").Name("ShortDescription").FieldLabel("Short Description").MaxLength(200));
}
) )
Thanks in advance.

More appropriate event is Load (it is fired when data is loaded to the store from a remote source)
See the following description
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Store-event-datachanged

Related

How can i rewrite the following code with switchmap

Hi I have a small code snippet using rxjs library as follows. It is working fine . However I would like to re write it using switchmap . I tried all option however i am getting an error . was wondering if someone could help me out .
this.campaignControl.valueChanges.subscribe(
(value) => {
this.flightsService.getUnpaginatedFlightsWithinRange(
{
campaignId : value,
jobStatuses: this.flightStatusIds,
rangeStartDate:
(this.rangeControl.value[0]).toISOString(),
rangeEndDate: (this.rangeControl.value[1]).toISOString()
}
).subscribe(
(flightsUnpaginated) => {
this.flights = flightsUnpaginated;
}
);
}
);
thank you
I believe you're looking for something like this:
this.campaignControl.valueChanges.pipe(
switchMap(value => this.flightsService.getUnpaginatedFlightsWithinRange({
campaignId : value,
jobStatuses: this.flightStatusIds,
rangeStartDate: (this.rangeControl.value[0]).toISOString(),
rangeEndDate: (this.rangeControl.value[1]).toISOString()
}),
tap(flightsUnpaginated => this.flights = flightsUnpaginated)
).subscribe();

How to upload large csv file into mysql fastly in codeigniter?

I am using codeigniter framework. I want to upload larg csv file into mysql database fastly. The file contains 87000 rows. I have added for uploading the data, but it is loading morethan 1 hour. i need to optimize this time.Please suggest me.
if(move_uploaded_file($_FILES['file_content']['tmp_name'],$path.$actual_file_name))
{
if (($handle = fopen($path.$actual_file_name, "r")) !== FALSE)
{
while (($data = fgetcsv($handle,100000, ",")) !== FALSE)
{
$insert_batch=array(
'unique_transactionid' => mb_check_encoding($data[0], 'UTF-8') ? $data[0] : utf8_encode($data[0]),
'data-year' => mb_check_encoding($data[2], 'UTF-8') ? $data[2] : utf8_encode($data[2]),
'supplier_group' => mb_check_encoding($data[4], 'UTF-8') ? $data[4] : utf8_encode($data[4]),
);
this->db->insert('table name', $insert_batch);
}
}
}
I need the data is uploading fastly. Currently our server max_excecution time is 10 mins. It excecutes more than 10 mins and the page is not redirect to my page and at last i got page not found error. Please help me to upload fastly.
take the insert() function out of the while loop and use batch_insert() instead. What you are doing right now, is creating the array and insert, for each of the rows.
$i=0;
while (($data = fgetcsv($handle,100000, ",")) !== FALSE)
{
$insert_batch[$i]=array(
'unique_transactionid' => mb_check_encoding($data[0], 'UTF-8') ? $data[0] : utf8_encode($data[0]),
'data-year' => mb_check_encoding($data[2], 'UTF-8') ? $data[2] : utf8_encode($data[2]),
'supplier_group' => mb_check_encoding($data[4], 'UTF-8') ? $data[4] : utf8_encode($data[4]),
);
$i++;
}
$this->db->insert_batch('table_name', $insert_batch);

Property doesn't exist on type {}

I am trying to get a list of objects from a firebase db using snapshotChanges.
Angular Version: 7.2.0,
Firebase Version: 5.8.1,
RxJS Version: 6.3.3,
AngularFire2: 5.1.1
My code is the following:
this.fbSubs.push(this.db
.collection('availableExercises')
.snapshotChanges()
.pipe(
map(docArray => {
return docArray.map(doc => {
return {
idExercise: doc.payload.doc.id,
name: doc.payload.doc.data().name,
duration: doc.payload.doc.data().duration,
calories: doc.payload.doc.data().calories
};
});
})
)
.subscribe((exercises: Exercise[]) => {
// code...
}, error => {
// code...
}));
When I try to compile this code, I get the following errors:
ERROR in src/app/training/training.service.ts(41,44): error TS2339: Property 'name' does not exist on type '{}'.
src/app/training/training.service.ts(42,48): error TS2339: Property 'duration' does not exist on type '{}'.
src/app/training/training.service.ts(43,48): error TS2339: Property 'calories' does not exist on type '{}'.
I believe the syntax may be outdated from a previous version of RxJS but I can't seem to work out what I need to change.
So I had to slightly change the code around in .pipe.map() to return the data as "Exercise" like so:
.pipe(
map(docArray => {
return docArray.map(doc => {
const data = doc.payload.doc.data() as Exercise;
const idExercise = doc.payload.doc.id;
return {idExercise, ...data};
});
})
)
.pipe(
map(docArray => {
return docArray.map(doc => {
return {
id: doc.payload.doc.id,
...doc.payload.doc.data() as Exercise
};
});
})
)

BooleanField with FunctionField change number to Boolean

I have question and I'm sure it will help other developers.
I have field "is_active" which is Boolean in my API side but it return 0 or 1 and not TRUE or FALSE.
I want to use <FunctionField/> to wrap the <BooleanField/> but it didn't work. Someone can help please.
This is my code:
<FunctionField source="is_active" label="is_active" render={(record) => record.is_active ? true : false}>
<BooleanField/>
</FunctionField>
The column is still blank.
Thanks.
I think you misunderstood the FunctionField component. It renders the result of the render prop. What you are trying to achieve is:
<FunctionField source="is_active" label="is_active" render={(record,source) =>
<BooleanField record={{...record,is_active:!!record.is_active}} source={source}/>}/>
But this is not very nice. Better is to wrap your dataProvider/restClient and ensure the data is a boolean.
// In FixMyDataFeature.js
export default restClient => (type, resource, params) => restClient(type,resource,params).then(response=>
if(resource === 'Resource_with_numeric_is_active_field`){
return {
data: mutateIsActiveFieldToBoolean(response.data)
}
}
else{
return response;
}
);
And call it with Admin:
<Admin dataProvider={FixMyDataFeature(dataProvider)}... />
Here is my solution: (you can import it and use instead of BooleanField)
import React from 'react';
import { BooleanField } from "react-admin";
export const BooleanNumField = ({ record = {}, source}) => {
let theRecord = {...record};
theRecord[source + 'Num'] = !!parseInt(record[source]);
return <BooleanField record={theRecord} source={source + 'Num'} />
}
I had an issue where the in a DB table there was a field called disabled but in the Admin was a bit confusing setting disabled to false to actually enable something.
Based on 'Dennie de Lange' answer, I have created a Typescript generic BooleanOppositeField and BooleanOppositeInput. Putting here hoping may help someone:
import { BooleanField, BooleanInput, FunctionField } from 'react-admin';
interface IProps {
label: string;
source: string;
}
/**
* Usually called using:
* <BooleanOppositeField label="Enabled" source="disabled"/>
*/
export const BooleanOppositeField = (props: IProps) => {
return (
<FunctionField {...props} render={(record: any | undefined, source: string | undefined) =>
<BooleanField source="enabled" record={{ ...record, enabled: !(record![source!]) }} />}
/>
);
};
/**
* Usually called using:
* <BooleanOppositeInput label="Enabled" source="disabled" />
*/
export const BooleanOppositeInput = (props: IProps) => {
return (
<BooleanInput format={(v: boolean) => !v} parse={(v: boolean) => !v} {...props} />
)
}
And you can use it by:
<BooleanOppositeField label="Enabled" source="disabled"/>
or
<BooleanOppositeInput label="Enabled" source="disabled" />
Note: I liked more this solution, than the recommended by Dennie

Implementing debouncing batching queue with RxJS

I was trying to understand if RxJS would be a good fit for solving the problem that this node module performs: https://github.com/ericdolson/debouncing-batch-queue
It's description says: "A queue which will emit and clear its contents when its size or timeout is reached. Ideal for aggregating data for bulk apis where batching in a timely manner is best. Or anything really where batching data is needed."
If so, could someone walk me through how to implement the simple example in this npm module with RxJS? Ideally with ES5 if possible.
There's an operator for thatâ„¢: bufferwithtimeorcount. If you need it to be truly equivalent, the input stream would be a Subject, with group_by for namespaces, like the following:
var dbbq$ = new Subject();
dbbq$.group_by(function(v_ns) { return v_ns[1]; })
.flatMap(function(S) {
return S.bufferwithtimeorcount(1000, 2)
});
dbbq$.next([ 'ribs 0' ]);
dbbq$.next([ 'more ribs', 'bbq1' ]);
// is analogous to
var dbbq = new DBBQ(1000, 2);
dbbq.add('ribs 0');
dbbq.add('more ribs', 'bbq1');
No way I'm doing this with ES5 :)
const dataWithNamespace = (data, namespace) => ({data, namespace});
const source = [
dataWithNamespace('ribs 0'),
dataWithNamespace('ribs 1'),
dataWithNamespace('ribs 2'),
dataWithNamespace('ribs 3'),
dataWithNamespace('ribs 4'),
dataWithNamespace('more ribs', 'bbq1'),
dataWithNamespace('more ribs', 'bbq1'),
dataWithNamespace('brisket', 'best bbq namespace')
];
const DBBQ = (debounceTimeout, maxBatchSize) =>
source$ => source$
.groupBy(x => x.namespace)
.mergeMap(grouped$ => grouped$
.switchMap(x =>
Rx.Observable.of(x.data)
.concat(Rx.Observable.of(undefined)
.delay(debounceTimeout)
)
)
.bufferCount(maxBatchSize)
.filter(x => x.length == maxBatchSize)
.map(x => x.filter(x => x !== undefined))
);
const source$ = Rx.Observable.from(source);
DBBQ(1000, 2)(source$).subscribe(console.log)
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.6/Rx.js"></script>

Resources