|
|
Hello
Thanks for reply.
Every application has own problems and benefits.
|
|
|
|
|
You product selection line is not part of the detail and can be placed in the master area or as a separate area altogether, it does not participate in the master detail structure but adds to the detail.
Never underestimate the power of human stupidity -
RAH
I'm old. I know stuff - JSOP
|
|
|
|
|
My Table Stucture look like
OrderId int
OrderNo string
CustomerName string
AddDate DateTime
OrderDtlId int
OrderId int(FK from OrderMaster)
ProductId int(FK from ProductMaster)
Qty decimal
Rate decimal
|
|
|
|
|
Your table structure is correct. You need to add a detail item when the user clicks add taking the ProductId from the user selection. This needs to be done in code, not in the UI control.
Never underestimate the power of human stupidity -
RAH
I'm old. I know stuff - JSOP
|
|
|
|
|
There are many libraries for activities like slider, drag and drop, while these are available, do we need to know pure javascript for these situations when working in a company? Sure, most people are familiar with the classic scrolling structure I've been talking about, but the more advanced ones I mentioned. Of course, this should be a general situation, although it varies from company to company. How necessary do you think it is to learn these
|
|
|
|
|
You got caught by the content filters and your messages were waiting for human moderation.
As you reposted the message, I have let through both copies but deleted one of them.
Please next time be patient, we get a lot of spam and that's why the filters and the human "OK" might be needed for some posts by new accounts.
M.D.V.
If something has a solution... Why do we have to worry about?. If it has no solution... For what reason do we have to worry about?
Help me to understand what I'm saying, and I'll explain it better to you
Rating helpful answers is nice, but saying thanks can be even nicer.
|
|
|
|
|
It entirely depends on the circumstances. You have to strike a balance between how much overhead the library adds to you page versus how much developer time it would take to implement the feature using pure Javascript.
Something like drag and drop[^] is fairly easy to implement in pure Javascript these days. But a library might have more advanced features which may take a while to replicate.
But either way, I wouldn't necessarily expect anyone to "know" the APIs, since there are plenty of references available to look them up.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
I'm trying to create a 90 deg rotated layout. But the problem is that none of the method I used to use works in this case. Since it is rotated, changing size, getting it responsive does not seem to work.
I'm trying to let the "My Project" title take half of the rotated screen and the other half will contain images and containers.
Can anyone help me out with this? How do i make sure that it resizes and placement is always half:half layout without overflow during resize in different device size. Please provide me with a hint to complete my work. Thank you!
Link to the code in jsfiddle.
Here's a link to the think I'm doing: https://jsfiddle.net/7tfy4gdh/1/
Here's what i want to build: https://prnt.sc/10wb1p7
What I have tried:
I've tried doing flex, using vh, and media query. I just can't seem to get it done. Please help!
|
|
|
|
|
Hi. I need some idea on how to document this refresh token API details based on this codes? What details should I provide? I can't really understand.
@GetMapping(value = Constants.REST_API_REFRESH_TOKEN)
public ResponseEntity<Object> getRefreshToken(@RequestHeader(Constants.HTTP_AUTH_HEADER) String authHeader, HttpServletRequest request) {
log.info("Generate refresh token");
String token = httpUtil.extractSecurityToken(authHeader);
ResponseBase body = new ResponseBase();
body.setSuccess(true);
body.setMessage("Refresh Token generated");
String refreshToken;
DefaultClaims claims = (io.jsonwebtoken.impl.DefaultClaims) request.getAttribute("claims");
if(null == claims) {
refreshToken = jwtTokenUtil.renewToken(token);
} else {
refreshToken = jwtTokenUtil.renewToken(claims);
}
return httpUtil.createResponseEntityJson(HttpStatus.OK, httpUtil.createSecTokenHeader(refreshToken), body);
}
|
|
|
|
|
I've been trying for a couple of hours. So I have these models or object classes, one called KeyValues and KeyValue. I make a database call, and create the KeyValues object with a collection of KeyValue. This is working pretty good in just PHP V7.4.14, and I'm happy with it.
So now, I made an API, that creates a JSON array of KeyValues, and some plain Javascript to call Fetch and get the list from my hacked together PHP file. I can't figure out how to package the JSON from my object in PHP.
I wanted to use the example below, forJSON(), and was thinking that it can take an object, and package it in one line of code, but I have no clue if I fabricated it right, and how to call it. I would that it belongs in the InteratorIterator to process the whole object.
The last example is me trying just piece something together from information on the internet. I had a couple that worked, but the format was wrong, so this is just concept code of what I'm trying to do.
I just need help in filling in a couple of blanks I'm missing in the concept of how it works.
class KeyValues extends IteratorIterator {
<pre>
public function __construct(KeyValues ...$keyValues)
{
parent::__construct(new ArrayIterator($keyValues));
}
class KeyValue {
var $key;
var $value;
var $keyValues;
public function __construct()
{
}
public function getKey() { return $this->key; }
public function setKey($key) { $this->key = $key; }
public function getValue() { return $this->value; }
public function setValue($value) { $this->value = $value; }
public function forJSON(): array
{
foreach ($this->keyValues as $keyValue) $keyValues[] = $keyValue->forJSON();
return array(
'key' => $this->getKey(),
'value' => $this->getValue()
);
}
}
$jsonRaw = [];
foreach ($keyValues as $keyValue) {
$jsonArray = $keyValue->getKey() => $keyValue->getValue();
array_push($jsonRaw, $jsonArray);
}
echo json_encode($jsonRaw, JSON_PRETTY_PRINT);
exit();
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
I can't believe how much time I spent on this, to write about 5 lines of code. I wasn't able to get my object forJson() to work 100% but I'm pretty close on it, actually being able to generate JSON from an object->forJson(); . So this is my temp solution for now so I can move forward.
I'm kind of surprised that json_encode knew to wrap the strings in quotes, and leave the numbers as is.
$jsonArray = [];
foreach ($keyValues as $keyValue) {
$jsonItem = array(
"key" => $keyValue->getKey(),
"value" => $keyValue->getValue()
);
array_push($jsonArray, $jsonItem);
}
echo json_encode($jsonArray, JSON_PRETTY_PRINT);
Also using plain Javascript, and trying to stay sort of ECMA 6, which also took forever to figure out yet so simple. This is inside a Fetch call to a PHP file that just echos out JSON.
I was really surprised that I didn't have to parse the JSON, or do anything special with it. I fiddled with the Object using different types and they all seem to produce the same values.
for (const keyValue of Object.values(data)) {
let option = document.createElement('option');
option.text = keyValue.key;
option.value = keyValue.value;
addOperationElement.add(option);
}
Alright, back to being able to move forward with this section of the app. I'm starting to like PHP V7+ and can see why so many companies use it. It does the job and is fairly simple to construct and fabricate. But you need a damn good editor like PHP Storm to keep it organized and clean.
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
I have this upload files button in my app. So far my progress bar works fine but it just shows the loading bar while the file is uploading. So how do I add features to show the status of the upload % completed, also display the upload speed and the real time counter ETA to complete upload? Can it be achieved from front-end alone?
Here's my file-upload.component.html
<pre><input *ngIf="uploader.queue.length < 3" #uploadButton ng2FileSelect (change)="fileUpload()" [uploader]="uploader" id="supporting-doc-type-{{docType}}"
type="file"
class="upload-button"/>
<label for="supporting-doc-type-{{docType}}" class="fake-upload-button">
{{'account.uploadNric.uploadDoc'| translate}}
</label>
<ng-container *ngIf="uploader != undefined && uploader.queue.length">
<div class="row" *ngFor="let item of uploader.queue">
<div class="col-8 text-left">
<ng-container *ngIf="item.isSuccess; else elseBlock1">
<a [attr.href]="getFileDownloadUrlByName(item.file.name)" target="_blank">{{item.file.name}}</a>
</ng-container>
<ng-template #elseBlock1>
{{item.file.name}}
</ng-template>
</div>
<div class="col-2">
<ng-container *ngIf="item.isSuccess; else elseBlock2">
{{getSimplifiedSize(item.file.size)}}
</ng-container>
<ng-template #elseBlock2>
<mat-progress-bar mode="determinate" color="primary" value={{item.progress}}></mat-progress-bar>
</ng-template>
</div>
<div class="col-2 text-right">
class="fa fa-trash trash-can-icon">
</div>
</div>
</ng-container>
<div *ngIf="documentFormatInvalid" class="alert alert-danger roboto-condensed-font">
{{'account.uploadNric.uploadFormatInvalid'| translate}}
</div>
<div *ngIf="documentExists" class="alert alert-danger roboto-condensed-font">
{{'account.uploadNric.uploadDocExists'| translate}}
</div>
<div *ngIf="documentGenericError" class="alert alert-danger roboto-condensed-font">
{{'account.uploadNric.uploadError'| translate}}
</div>
<div *ngIf="isExceedDocumentSize" class="alert alert-danger roboto-condensed-font">
{{'account.uploadNric.uploadSizeInvalid'| translate}}
</div>
My upload-file.component.ts
@Component({
selector: 'file-upload',
templateUrl: './file-upload.component.html',
styleUrls: ['./file-upload.component.scss']
})
export class FileUploadComponent {
docType = 'NRIC_FIN_DOCUMENT';
uploader: FileUploader;
fileIdentifier = new Map<string, string>();
@Input()
orderId: string;
@Input()
accountForm: FormGroup;
documentFormatInvalid = false;
documentExists = false;
documentGenericError = false;
isExceedDocumentSize = false;
@ViewChild('uploadButton') uploadButton: ElementRef;
constructor(private uploaderService: UploaderService, private utilService: UtilService,
private novusService: NovusService, private authService: AuthService) {
}
ngOnInit() {
this.utilService.observeData().subscribe(message => {
this.initiateUploader();
}
);
}
fileUpload() {
this.resetErrors();
const fileItem = this.uploader.queue[this.uploader.queue.length - 1];
fileItem.file.name = this.utilService.appendTimeStamp(fileItem.file.name);
this.uploader.queue[this.uploader.queue.length - 1] = fileItem;
const format = fileItem.file.type;
if (!this.uploaderService.validFileSize(fileItem.file.size)) {
this.isExceedDocumentSize = true;
this.uploader.queue.pop();
this.updateForm();
return;
}
if (!this.uploaderService.validFileFormat(format)) {
this.documentFormatInvalid = true;
this.uploader.queue.pop();
this.updateForm();
return;
}
const name = fileItem.file.name;
const orderId = this.orderId;
this.uploader.onBuildItemForm = (fileItem: any, form: any) => {
form.append('name', name);
form.append('orderId', orderId);
form.append('token', this.novusService.getMetaToken());
};
this.uploadButton.nativeElement.value = '';
this.uploader.queue[this.uploader.queue.length - 1].upload();
}
getFileIdentifierByName(fileName: string): string {
return this.fileIdentifier.get(fileName);
}
getFileDownloadUrlByName(fileName: string): string {
return this.uploaderService.getDocumentDownloadUrl(this.getFileIdentifierByName(fileName));
}
getSimplifiedSize(size: string): string {
return this.uploaderService.fileSizeConvertor(parseInt(size));
}
deleteFile(fileIdentifier: string): void {
this.uploaderService.fileRemove(fileIdentifier).subscribe(res => {
});
}
removeFileFromUploader(fileName: string): void {
this.uploader.queue = this.uploader.queue.filter(function(el) {
return el.file.name != fileName;
});
this.updateForm();
}
resetErrors(): void {
this.isExceedDocumentSize = false;
this.documentFormatInvalid = false;
this.documentExists = false;
this.documentGenericError = false;
}
updateForm(): void {
const fileNames = this.uploader.queue.map(res => {
return res.file.name;
});
this.accountForm.controls.fileUpload.markAsTouched();
this.accountForm.controls.fileUpload.setValue(fileNames.join(';'));
}
initiateUploader(): void {
const uploadHeaders = [{
name: 'Accept', value: 'application/json, text/javascript, */*; q=0.01',
}, {
name: 'Authorization',
value: `Bearer ${this.authService.getToken()}`
}];
const options: FileUploaderOptions = {
url: `api/document/upload`,
itemAlias: 'data',
headers: uploadHeaders,
};
this.uploader = new FileUploader(options);
this.uploader.onSuccessItem = (item, response) => {
if (response) {
const resp = JSON.parse(response);
if (resp) {
this.fileIdentifier.set(item.file.name, resp.api_message);
} else if (resp.key === 'FILE_EXISTS') {
this.uploader.queue.pop();
this.documentExists = true;
} else {
this.uploader.queue.pop();
this.documentGenericError = true;
}
}
this.updateForm();
};
this.uploader.onAfterAddingFile = (file) => {
file.withCredentials = false;
};
}
}
And upload-file.component.css
.upload-button {
display: none;
}
.fake-upload-button {
border-radius: 4px;
color: #fff;
background-color: #29b6f6;
padding: 4px 20px;
cursor: pointer;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9 {
padding: 0;
}
.trash-can-icon {
cursor: pointer;
font-size: 18px;
}
|
|
|
|
|
Your asking for lots of features, and it looks like you downloaded a angular package.
Well for a spinner, you have to declare a variable to flag the upload event at the start of upload, then the HTML page would be set to pick up that variable change and show the spinner, when the upload is complete, you toggle the variable and the HTML will hide the spinner.
I have to code to show you. But to write the upload speed and percent, would require you to make a custom component and author it. Not an easy task and very time consuming. There is no quick answer for that.
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
Hi all
Could any body help me to clear the code line : total[language] = total[language] + 1 || 1 in this code block:
const url = 'https://api.github.com/users/john-smilga/repos?per_page=100'
const fetchRepos = async () => {
const response = await fetch(url)
const data = await response.json()
const newData = data.reduce((total, repo) => {
const { language } = repo
if (language) {
total[language] = total[language] + 1 || 1
}
return total
}, {})
console.log(newData)
}
fetchRepos()
thanks a lot
|
|
|
|
|
To "clear" the code line, simply delete the line. That will of course render the surrounding if block irrelevant, and ensure that your reduce method simply returns an empty object, so your fetch request is also irrelevant. The final function would be:
const fetchRepos = () => {
const newData = {};
console.log(newData);
};
NB: If that's not what you're trying to do, then you need to provide a clearer explanation of your requirement.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Thanks for your reply
I still confuse with
total[language]
could you clear to me
thanks alot
|
|
|
|
|
It's an alternative syntax for a property accessor, which is required when the property name is not fixed.
Property accessors - JavaScript | MDN[^]
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
thanks alot
i know total[language] shall return to string but here they took total[language] plus with 1 that is point i still confuse.
Could you make it more clear
kidly thanks
|
|
|
|
|
No, language will be a string; total[language] will be a number.
Initially, it will be undefined , which is why there's a || 1 on the end:
undefined + 1 === undefined ;undefined || 1 === 1 ; Assigning a default value to a variable - JavaScript | MDN[^]
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Thanks alot for your deep explaination
But when i console.log(total[language]) it return for me string: javascript, css and html rather number
thanks alot
|
|
|
|
|
Hello! I need some help with my project, it's only html and css, please contact me in private and we can talk there. Thank you very much!
|
|
|
|
|
Sorry, no. This is an open forum for technical discussions and questions. If you want someone to work for you then try freelancers.com.
|
|
|
|
|
i said i need help not for someone to do the project for me
|
|
|
|
|
|