A general chat about JavaScript. Ask anything you like or share your best cat picture. Please check Google/StackOverflow for answers before asking for help. And remember, be nice! Don't ask to ask, just ask
$.get
will call the error handler while fetch
only considers requests failed if no response comes back at all or if the response seems corrupt). fetch
is not as widely supported as $.get
(this can be addressed with a polyfill, but in that case you're probably not saving much space compared to just using jQuery). So definitely not exactly a drop-in replacement, but yes, they do serve the same purpose.
fetch
everywhere, I agree it doesn't make much sense to keep jQuery around just for $.get
.
pushTypeaheadSearchFormatField(element: any, index: any) {
this.formFields.push({
'key': element[index].name,
'wrappers': ['labelWrapper'],
'type': 'typeahead',
'defaultValue': element[index].defaultValue,
'templateOptions': {
'type': 'typeahead',
'key': element[index].name,
'label': element[index].displayName,
'required': element[index].isRequired && element[index].isRegulatoryRequirement ? false : element[index].isRequired,
'isRegulatoryRequirement': element[index].isRegulatoryRequirement,
'dependencyRules': element[index].dependencyRules,
'showLookupNotice': element[index].isOptionRequired,
'optionsUrl': element[index].optionsUrl,
'changeExpr': 'this.getData($event, field)',
'isregularatoryProduct': this.isregularatoryProducts(element[index].name),
'placeholder': 'Typeahead States',
'search$': (term) => {
if (term && term.length > 2) {
this._http.get<any>(AppConstants.wkApiUrl.producerCode).subscribe(result => {
const product = result.paginationData.map(key => key['name']);
const filteredProduct = product.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1).slice(0, 10);
return of(filteredProduct);
})
} else {
return of([]);
}
// const states = this.states.map(key => key['name']);
// if ((!term || term === '')) {
// return of(states);
// }
// return of(states.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1));
},
},
});
}
filterData(result, term) {
const product = result.paginationData.map(key => key['name']);
const filteredProduct = product.filter(v => v.toLowerCase().indexOf(term.toLowerCase()) > -1).slice(0, 10);
return of(filteredProduct);
}
anyone help me about javascript with styling . here is my code snippet
i want when complete the bar percentage from the html means it get the percentage from an html and apply it using js dynamically
ok, if you check the code snippet UI that have a percentage bar which is completed bar in percentage based on percentage written in html or above in every line. So as of now that is working fine with css. But i am trying to achieve that using javascript .
and remove css when it's coming from javascript
.skills__html {
width: 60%;
}
.skills__css {
width: 70%;
}
.skills__js {
width: 75%;
}
.skills__react {
width: 90%;
}
@jgonggrijp
:point_up: Edit: Hi, having a bit of a conundrum.
Material-UI/pickers.datepicker has been deprecated (mui-org/material-ui-pickers#2157), and I'm currently at work with a task to do some style changes to and existing picker based on this datepicker. But the style changes would require me to migrate to the new version for a specific override feature (for popover dynamic styling based on props).
Now the question is, should I migrate to @mui/lab and mui v5 in the future, or just avoid mui altogheter and include a vanilla js datepicker (https://github.com/qodesmith/datepicker) to customize. I have to rewrite the component regardless.
What are your toughts on MUI in general? Is it worth the hassle when we have to customize with company styles anyway? I've been on the fence for a while, but am considering to drop it altoghether
Edit: concluded with fuck MUI
:point_up: Edit: Hi, having a bit of a conundrum.
Material-UI/pickers.datepicker has been deprecated (mui-org/material-ui-pickers#2157), and I'm currently at work with a task to do some style changes to and existing picker based on this datepicker. But the style changes would require me to migrate to the new version for a specific override feature (for popover dynamic styling based on props).
Now the question is, should I migrate to @mui/lab and mui v5 in the future, or just avoid mui altogheter and include a vanilla js datepicker (https://github.com/qodesmith/datepicker) to customize. I have to rewrite the component regardless.
What are your toughts on MUI in general? Is it worth the hassle when we have to customize with company styles anyway? I've been on the fence for a while, but am considering to drop it altoghether
Edit: concluded with fuck MUI
Edit 2: when with this one if anyone cares; https://github.com/wwilsman/Datepicker.js
:point_up: Edit: Hi, having a bit of a conundrum.
Material-UI/pickers.datepicker has been deprecated (mui-org/material-ui-pickers#2157), and I'm currently at work with a task to do some style changes to and existing picker based on this datepicker. But the style changes would require me to migrate to the new version for a specific override feature (for popover dynamic styling based on props).
Now the question is, should I migrate to @mui/lab and mui v5 in the future, or just avoid mui altogheter and include a vanilla js datepicker (https://github.com/qodesmith/datepicker) to customize. I have to rewrite the component regardless.
What are your toughts on MUI in general? Is it worth the hassle when we have to customize with company styles anyway? I've been on the fence for a while, but am considering to drop it altoghether
Edit: concluded with fuck MUI
Edit 2: wentwith this one if anyone cares; https://github.com/wwilsman/Datepicker.js
extend(DiscussionHero.prototype, 'oninit', function () {
const GameApi = fetch('https://api.rawg.io/api/games/call-of-duty-modern-warfare?page_size=1&page=1&key=myapi')
.then(response => response.json())
.then(data => {
this.gameDet = data;
console.log(data)
console.log(this.gameDet.name)
console.log(this.gameDet.description_raw)
console.log(this.gameDet.metacritic)
})
})
extend(DiscussionHero.prototype, 'items', function (items) {
items.add(
'aaaa',
<div className="myclass">
<div class="myclass">
// <------------------------------------------------ I WANT TO DISPLAY this.gameDet.name HERE
</div>
</div>
);
});
knexClient.schema.createTable("events", (table) => {
table.increments();
table.dateTime("starts_at").notNullable();
table.dateTime("ends_at").notNullable();
table.enum("kind", ["appointment", "opening"]).notNullable();
table.boolean("weekly_recurring");
});
guys, i have no experience with this, so i need help from an expert developer. i'm currently fetching an api, that return a string. i have this string into a div like:
<p class="card-text" id="google_translate_element">{this.gameDet.description_raw}</p>
there's a way to auto translate this string into navitator.language of the user?
Hi I have a quick question
Given this code:
de = () => {
ce(),
r.ipcMain.handle("someIPCFunction", (async () => !!oe().someValue))
}
How can I make it so I can window.alert
the value returned by the r.ipcMain.handle("someIPCFunction", (async () => !!oe().someValue))
As such I can see the value returned by r.ipcMain.handle...
as it is getting applied.
extend(CommentPost.prototype, 'oncreate', function () {
let AmILoggedIn = app.session.user;
if (AmILoggedIn) {
const ipApi = fetch('https://ipinfo.io/json?token=MYAPIKEY')
.then((response) => response.json())
.then((data) => {
this.ipData = data;
console.log(data)
})
.catch((error) => console.log('Something went wrong...'));
}
})
extend(CommentPost.prototype, 'headerItems', function (items) {
items.add(
"ipinfo",
<div className="ipinfo" id="countryCode">{ipData.country}</div>
)
})
extend(CommentPost.prototype, 'headerItems', function (items) {
const giveMeInfo = fetch("https://ipinfo.io/json?token=mykey")
.then((response) => response.json())
.then((data) => {
this.ipInfo = data;
console.log(this.ipInfo.country)
const flagImage = 'http://purecatamphetamine.github.io/country-flag-icons/3x2/' + data.country.toUpperCase() + '.svg';
},
items.add(
"ipinfo",
<div className="ipinfo" id="countryCode"></div>
))
})
});
<div className="ipinfo" id="countryCode">{this.ipInfo.country}</div>
not work
items.add
expression as the second argument to the final then
, which is almost certainly not what you want. You can try this instead:extend(CommentPost.prototype, 'headerItems', function (items) {
const giveMeInfo = fetch("https://ipinfo.io/json?token=mykey")
.then((response) => response.json())
.then((data) => {
this.ipInfo = data;
console.log(this.ipInfo.country)
const flagImage = 'http://purecatamphetamine.github.io/country-flag-icons/3x2/' + data.country.toUpperCase() + '.svg';
items.add(
"ipinfo",
<div className="ipinfo" id="countryCode">{this.ipInfo.country}</div>
);
});
});