Blancer.com Tutorials and projects
Freelance Projects, Design and Programming Tutorials
Category Added in a WPeMatico Campaign
Using Angular-IMask, I’m programatically updating the field that has IMask. So I’m getting the error:
“Element value was changed outside of mask. Syncronize mask using mask.updateValue() to work properly.”
How can I get imask object so I can call updateValue() ? I set the component only on the template, so I don’t have any object in the component I can access.
as you can see the function can return the value from the cell i selected
but in apps script, the cell value from the spreadsheet is undefined
i’m confused, why the “undefined / null” value can be returned exact value by the cell i pass?
I’m a react newbie trying to create a shopping cart. I used redux toolkit to manipulate the cart array.
I’m also trying to increment the quantity counter in the product listing page itself.
Where I’m stuck at is when I try to decrement the quantity of a product in cart page and when the counter reaches 0, redux reducer function deletes the corresponding entry from the cart array. But that creates a problem when I try to access the quantity counter and try to show “Buy now” button again in product listing page.
Code snippets:
export interface Product {
productID: number;
productName: string;
productDesc: string;
productImageURL: string;
originalPrice: number;
offerPrice: number;
quantity: number;
}
const productTile = (data: Product) => {
const toast = useToast();
const dispatch = useAppDispatch();
const cart = useAppSelector((state) => state.cartReducer);
const [showButton, setShowButton] = React.useState<Boolean>(true);
const handleClick = (product: Product) => {
dispatch(addItem(product));
toast({
title: "Item added to cart",
status: "success",
isClosable: true,
duration: 6000,
});
setShowButton(false);
};
const handleDecrement = (product: Product, cartProducts: Product[]) => {
console.log("inside handle decrement");
console.log(product.productID);
cartProducts.map((cartProduct) => {
if (product.productID === cartProduct.productID) {
if (cartProduct.quantity < 2) {
setShowButton(true);
dispatch(decrementQuantity(product));
}
dispatch(decrementQuantity(product));
}
});
};
React.useEffect(() => {
cart.product.map((cartItem) => {
return cartItem.quantity < 1 || cartItem.quantity === null ? (
setShowButton(true)
) : (
<></>
);
});
}, [cart]);
return (
<Box>
<HStack p={2}>
<Image></Image>
<Box w={200} h={75}>
</Box>
<HStack>
{showButton && (
<Button onClick={() => handleClick(data)}>Buy now</Button>
)}
{!showButton && (
<HStack>
<Button onClick={() => handleDecrement(data, cart.product)}>
-
</Button>
<Box>
{cart.product.map((cartItem) => {
return cartItem.productID === data.productID ? (
cartItem.quantity > 0 ? (
<Text>{cartItem.quantity}</Text>
) : (
<Text>0</Text>
)
) : (
<></>
);
})}
</Box>
<Button onClick={() => dispatch(incrementQuantity(data))}>
+
</Button>
</HStack>
)}
</HStack>
</HStack>
</Box>
);
};
export default productTile;
cartTile.tsx
<Button
colorScheme="green"
size="xs"
onClick={() => dispatch(incrementQuantity(cartItem))}
>
+
</Button>
</HStack>
<Text fontSize="x-small" alignSelf="end">
subtotal: {cartItem.quantity * cartItem.offerPrice}
</Text>
</VStack>
</Box>
<Box
w="33%"
display="flex"
flex={0.5}
alignItems="center"
justifyContent="center"
>
<Button
borderWidth={1}
boxShadow="md"
onClick={() => dispatch(removeItem(cartItem))}
>
What I want to know is how can I show my But now button in product tile when an item is deleted by another component?
I have a value in one of my cells that I would like to access, parse, and output a derived from value in another cell. To do what I want in google sheet functions would be very tedious.
Is there to write and call an App script function in the cell? I’m new to App Scripts, but I thought this might be possible.
I am getting error on this line this.contactObj[row] = finall . My method is calling on cellchange event in table and I am using childobject data in table but when I am updating cell value in childObject I am getting error. Could anyone tell me is there any syntax error.
export default class EOperation extends LightningElement {
data = [];
columns = columns;
step = '1';
@api recordId;
boolvalue = true;
emaildata = '';
subject = '';
body = '';
hasError = false;
error;
contactObj = [];
fldsItemValues = [];
temp = [];
secondContact
handleSave(event) {
console.log('draft valus ID ' + JSON.stringify(event.detail.draftValues));
console.log(' type are ' + typeof(event.detail.draftValues) + ' IS Array ' + Array.isArray(event.detail.draftValues));
this.temp.push(event.detail.draftValues);
console.log('Temp 0 ' + JSON.stringify(this.temp['id']))
let row = JSON.stringify(event.detail.draftValues).split(',')[1];
row = row.substring(row.indexOf('-') + 1, row.indexOf('}') - 1)
console.log('row is ' + row)
let field = JSON.stringify(event.detail.draftValues).split(',')[0] + '}';
console.log('ffffis ' + field)
let fieldValue = field.substring(field.indexOf(':') + 2, field.indexOf('}') - 1);
console.log('fieldvalue is ' + fieldValue)
let queryString = '' + field.substring(field.indexOf('{') + 1, field.indexOf('}')) + '';
console.log('queryString ' + typeof(queryString))
field = field.substring(field.indexOf('"') + 1, field.indexOf(':') - 1);
console.log('field is sss ' + field)
let val = this.contactObj[row][field]
let rs = `"${field}":"${val}"`
console.log('rs is ' + typeof(rs))
console.log(' IS Array ' + Array.isArray(this.contactObj))
//let ts1 = this.contactObj.splice(row,1)
console.log(JSON.stringify(this.contactObj[row]).replace(rs, queryString))
console.log('tss is ')
let finall = JSON.parse(JSON.stringify(this.secondContact[row]).replace(rs, queryString));
// this.contactObj[row] =JSON.parse(JSON.stringify(this.contactObj[row]).replace(rs,queryString))
console.log(typeof(finall) + ' >>colomn are ' + typeof(this.secondContact[row]))
console.log('onl;lly ' + this.contactObj[row])
this.contactObj[row] = finall //getting error on this line
//this.secondContact[row]= '[{"Id":"0035j00000MM49HAAT","FirstName":"Alok","LastName":"Thirdss","Phone":"44564754654","Email":"[email protected]"}]'
// console.log(ts.replace(rs,queryString))
//console.log(this.contactObj[row])
//console.log(this.contactObj[row][field])
// let temp2 =
// this.contactObj[row][field] = fieldValue;
}
}
I am playing around with understanding how the Y-combinator works in functional programming. I have a basic factorial function which I have translated to:
console.log((f => n => (n===0) ? 1 : n*f(f)(n-1))(f => n => (n===0) ? 1 : n*f(f)(n-1))(5));
// 120But how exactly does this simplify (to itself) after calling itself repeatedly? For example, after two times it looks like this:
const fact0 = (f => n => (n===0) ? 1 : n*f(f)(n-1))(f => n => (n===0) ? 1 : n*f(f)(n-1));
// 1. substitute "f => n => (n===0) ? 1 : n*f(f)(n-1)" for function call of f
const fact1 = (n => (n===0) ? 1 : n*(f => n => (n===0) ? 1 : n*f(f)(n-1))(f => n => (n===0) ? 1 : n*f(f)(n-1))(n-1));
// 2. ... ?
// 3. ... ?
// Test to make sure results are ok
console.log(fact0(5) === fact1(5))I am looking for help with v-if and v-else. I thought with this code that I would get back only one of my messages, but both keep appearing on screen?
Here is my code:
<div v-if="seen">
<span>Now you see me</span>
</div>
<div v-else>
<span>Now you don't</span>
</div>
data: {
seen: true,
},
I am sorting through data collected on a master sheet, and then placing it in separate sheets based on those values. The sorting and placing the data into lists isn’t the issue.
I’m having trouble figuring out how to loop the placement of the data into the separate sheets. The data is already separated into lists in 2D arrays. Below is a shortened version of myt code, and at the end is the hard coded solution, but I should be able to accomplish this in a loop, right?
Ideally I should be able to run a loop through the lists and place the sorted data into the separate sheets.
var ss = SpreadsheetApp.getActiveSpreadsheet();
var ml = ss.getSheetByName('Master List');
var lists = ["list1","list2];
var masterlist = ml.getRange(2,2,100,100).getValues();
var list1 = [];
var list2 = [];
for(i=0;i<masterlist.length;i++) {
if(masterlist[i][2]==lists[0]){
adminSec.push(masterlist[i])
}
if(masterlist[i][2] == lists[1]){
math.push(masterlist[i])
}
}
ss.getSheetByName(domains[0]).getRange(2,2,list1.length,list1[0].length).clearContent();
ss.getSheetByName(domains[0]).getRange(2,2,list1.length,list1[0].length).setValues(list1);
ss.getSheetByName(domains[1]).getRange(2,2,list2.length,list2[0].length).clearContent();
ss.getSheetByName(domains[1]).getRange(2,2,list2.length,list2[0].length).setValues(list2);Want make two steps html + js script for for rating system
First I want ask user a simple question.
Do you want block user yes or not
if YES in 3 other group A B C with range from 0 to 10 script auutomaticly check 0 0 0
if NOT in 3 other group A B C with range from 0 to 10 user will check radiobutton anyone he want
and
if user check YES script auutomaticly check 0 0 0 and user change answer from 0 to another option than radiobutton change from YES to NO
I am not sure its clear for everyone
I want to implement the following logic of translating Action message:
If source (second parameter passed to $t — mainPage in the example bellow) is specified it then should try to get a translation from currentLocale.key.source path. If source key (mainPage) was not found or it is null I want to show the key itself ('Action') to a user.
Messages structure:
{
'by': {
'Action': {
'menu': 'Дзеянне',
'mainPage': 'Аперацыя'
}
}
}
mainPage.vue
{{ $t('Action', 'mainPage') }}
One could say that this is the same to $t('Action.mainPage') but in case of undefined translation it will show 'Action.mainPage' which is a no go for me.
I was trying to achieve the same with named-formatting. There is a potential but doesn’t seem like a good option as it looks more as hack rather than a solution.
My guess is that $t should be overridden to implement this, but I couldn’t figure out how.
Use case is to reconstruct json in custom format :
1.
-JSON objects in sequenceFlow are unordered
-Input JSON example :SequenceFlow_1 ->SequenceFlow3 ->Flow_1 -> SequenceFlow2
-Full Example :
"sequenceFlow": [
{
"_id": "SequenceFlow_1",
"_sourceRef": "StartEvent",
"_targetRef": "Activity_Select"
},
{
"_id": "SequenceFlow_2",
"_sourceRef": "Activity_Select",
"_targetRef": "ExclusiveGateway_select"
},
{
"_id": "Flow_1",
"_sourceRef": "ExclusiveGateway_select",
"_targetRef": "Activity_Update"
},
{
"_id": "Flow_2",
"_sourceRef": "Activity_Update",
"_targetRef": "End_Update_Event"
},
{
"_id": "Flow_3",
"_sourceRef": "ExclusiveGateway_select",
"_targetRef": "Activity_Delete"
},
{
"_id": "Flow_4",
"_sourceRef": "Activity_Delete",
"_targetRef": "End_Delete_Event"
}
]
2.1. Reconstruct only sequence flow to get order based on “_sourceRef”, “_targetRef”
2.2. second
Once sequence is ordered ,Reconstruct new json object like below format
{"1","startEvent" ,"_id": "StartEvent","_name": "hunger noticed"},
{"2","task" ,"_id": "Activity_Select","_name": "choose recipe"},
{"3","exclusiveGateway" ,"_id": "ExclusiveGateway_select","_name": "desired dish?",
{
{"3.1","task" ,"_id": "Activity_Update","_name": "update order"},
{"3.2","endEvent" ,"_id": "End_Update_Event","_name": "end update order"}
},
{
{"3.3","task" ,"_id": "Activity_Delete","_name": "delete order"},
{"3.4","endEvent" ,"_id": "End_Delete_Event","_name": "end delete order"}
}
}
i’ve made a small repo to demontstrate my issue: https://github.com/msawatzky75/user-event-input-test
i have a few different scenarios here:
each of these triggers a fetch request that is handled by msw. i have also setup 2 different DOM environments to run these tests in: jsdom and happy-dom.
only the tests that interact with input elements (checkbox and the text input) fail and the results are consistant across DOM environments.
What is the issue here? is it a bug with @testing-library/user-event? if not, how could one go about fixing this?
How to perform onblur check first in form check, switch to onchange check if there is an error, and then change to onblur check if there is no error during onchange.Now I’m using react-hook-form +Yup. React-hook-form can determine the mode at the beginning, but I can’t switch other modes during execution.
My application was working fine, then I updated it to react 18, now it is throwing “destroy is not a function” when I navigate from one route to another if the current route is using useEffect to call some APIs on load. I searched the internet in this regard but every question is not regarding this issue. maybe react 18 is new thats why i cant find a solution..
I learning web dev and I have to make a simple website constructor – user logs in, fills several forms, shoose design template and then get page on my domain, something like website-constructor.com/user-generated-page/ – according to his/her settings.
The question is – what frameworks I’d better choose for this job? User part I’ll do ok with javascript, but what is better for server part – generating a page? Maybe there are some special tools for such website?
Cheers, thanks a lot!