Well, I don't know if this is possible. I have any text, with a font X.
What I want is that these letters are shown on my page but stretched... like elongated...
Something like that... any idea how to achieve it?
I have an array that contains some objects inside, each object only has elements "concept, area.
let miArray = [{concepto:"examen", area:"matematicas",
concepto:"practico", area:"matematicas",
concepto:"tarea", area:"matematicas"}]
What I try is that, having a value of "concept" to obtain the position of that object in my vector. Is there any function like indexOf but for objects?
The other way would be to go through it with a foreach asking in each iteration, but maybe there is an easier way
I have a series of divs with different classes, but inside each of these divs, there are other divs. What I try is:
1 and 2 I got it like this...
let areaElement = document.querySelectorAll(".alumno_"+alumno_id+" > .be-area-rating");
With a selector query I select the parent... And immediately tell it which of the children to select.
But when I try to put an innerHTML on this I get undefined
.
let areaElement = document.querySelectorAll(".alumno_"+alumno.alumno_id+" > .be-area-rating").innerHTML;
Does anyone know why?
The HTML is this; I am using Laravel so I use {{}}
to declare a variable:
<div class="cell not-border alumno_{{$alumno->alumno_id}}" id="be-area-rating">
<div class="rowTable be-area-rating">
<div class="cell rating do-area">20</div>
<div class="cell rating do-area">20</div>
</div>
</div>
<div class="cell not-border alumno_{{$alumno->alumno_id}} " id="do-area-rating">
<div class="rowTable do-area-rating">
<div class="cell rating do-area">20</div>
<div class="cell rating do-area">20</div>
</div>
</div>
I have this...
this is my html
<section class="container-body" id="container_body">
<div class="header">
<button onclick="cargar();">Abrir</button>
</div>
<div class="body">
<div class="content">
</div>
</div>
</section>
And this is my css...
.container-body{
width: 100%;
background: var(--smoke);
padding-left: 270px;
transition: .6s;
box-shadow: 200px -146px 400px 0px rgba(0,0,0,1);
}
.agrandar-body{
padding-left: 60px;
transition: .6s;
}
.container-body .header{
height: 100px;
background: var(--white);
display: flex;
align-items: center;
border-bottom: 2px solid var(--secondary);
}
.container-body .body{
height: 700px;
display: block;
z-index: 9;
}
.container-body .body::before{
content: "";
position: relative;
top: 0px;
width: 100%;
height: 160px;
background: var(--secondary);
display: block;
z-index: 9;
}
.container-body .body .content{
background: red;
z-index: 999;
display: flex;
margin: 0px 30px 30px 30px;
height: 1000px;
}
Well, the problem is this... The green is supposed to be a ::before element of the .body, I want to put the red element ON TOP of the green one... but I can't. I tried with Z-index but it doesn't work... I don't know why.
I mean, it looks something like this...
For some reason my text keeps overflowing from my DIV, I don't know if it's because it's a container Flex
but I can't find how to make it adapt, I tried it in every way and I can't do it.
<a href="#">
<div class="image image1">
<div class="margin">
<p class="tittle">Lorem ipsum dolor sit amet consectetur adipisicing elit. Perspiciatis, voluptate?</p>
<p class="hidden">Vamos a comprar pan</p>
</div>
</div>
.general-info {
margin: 50px;
display: inline-block;
width: 100%;
padding: 0px;
white-space: nowrap;
text-align: center;
}
.image {
position: relative;
background-size: cover;
background-repeat: no-repeat;
height: 270px;
max-height: 500px;
width: 50%;
min-width: 300px;
padding: 10px 11px 12px 10px;
max-width: 500px;
display: inline-block;
margin: 0px 5px 0px 5px;
object-fit: cover;
}
.image::before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgb(206, 83, 77, .6);
transition: 2s;
opacity: 0;
}
.image:hover::before {
opacity: 1;
transition: .6s;
z-index: 7;
}
.image1 {
background-image: url("../../../public/img/general-info/girasoles.jpg");
}
.image2 {
background-image: url("../../../public/img/general-info/bosque.jpg");
}
.margin {
position: inherit;
display: flex;
align-items: flex-end;
height: 100%;
border: 2px solid rgb(255, 255, 255);
z-index: 10;
word-break: break-all;
}
.margin .tittle {
position: relative;
color: white;
width: 300px;
bottom: 5px;
left: 5px;
font-size: 30px;
z-index: 10;
transition: .6s;
text-transform: uppercase;
word-break: break-all;
}
.image:hover .margin .tittle {
bottom: 25px;
transition: .6s;
}
.image .margin .hidden {
position: absolute;
left: 7px;
bottom: -10px;
color: white;
opacity: 0;
transition: .6s;
}
.image:hover .margin .hidden {
opacity: 1;
transition: .6s;
z-index: 7;
bottom: 5px;
transition: .6;
}
I need a second line of text to be created but not to go out of the box but to keep growing upwards as in the second image
Well, I have a div
with a height set (300px) and a width
flex... Now, inside this, there is another div
, called box this div
I use to create like a border, but inside the box...
Something like that... I tried to put margin
, but it doesn't work. It's like I have to make a smaller internal box. If the size of the container were static it would be easy, I just subtract it 5px
from each side and that's it, but since width
it is flexible, well, I can't.
Basically I need an div
intern who has the samewidth -10px
The del HoverBox
is for an effect hover
, you can ignore it, just like the one div
in css
occupies 100% of the container.
.general-container {
.... display: flex ....
}
.contenedor {
position: relative;
display: inline-block;
text-align: center;
width: 50%;
max-width: 500px;
height: 250px;
background-size: cover;
object-fit: cover;
margin: 10px;
}
.Caja {
position: absolute;
width: 96%;
height: 92%;
margin: 10px 10px;
border: 2px solid rgba(247, 9, 9, 0.8);
}
<section class="general-info">
<a href="">
<div class=" image image1">
<div class="hoverBox" id="hoverBox">
<div class="Caja">
<div class="texto">Eran sus flores favoritas</div>
<div class="textoOculto">Porque los girasoles siempre le encantaron.</div>
</div>
</div>
</div>
</a>
<a href="">
<div class="image image2">
<div class="hoverBox" id="hoverBox">
<div class="Caja">
<div class="texto">Paseos en el bosque</div>
<div class="textoOculto">Para relajar el alma y mantenerte en armonía.</div>
</div>
</div>
</div>
</a>
</section>
this language has me suffering, I can't find how to do it. Does anyone have any idea how to count words in DART or how to count empty spaces?
string micadena ="Hola mundo soy Aldahir";
int longitud = " ".allmatches(micadena).lenght;
return longitud;
I have this, this tells me the number of specific letters eg, a, b, c, d and so on... but what I want is to count the spaces to know the number of words, or if there is any other function to know the number of words.
Well, I have a problem, mostly I'm cleaning up my code.
$general_controller = new GeneralController();
$user_data = $general_controller->userData();
I am calling a method from another class, this is the code I use. First I call a new instance of the class and then in that class I point to the motodo I want. I would like to know if there is any way to do it directly in a single line and not in two.
I have a query created with QueryBuilder, it is a update
and what I want is for a field to only reduce by 1.
DB::table('Medicos')
->where('ID','=',$request->medico)
->update(['fichas'=>'fichas-1']);
I don't know if I'm explaining myself... it's something like that. Otherwise, you would have to make a query to know how many you have, subtract it in the logic and then modify the data in the database.
I have a query of type Insert
and I need to know if that query succeeded to perform a following query.
DB::table('fichas_medicas')
->insert(['Paciente_ID' => $user_data->ID,
'Medico_ID' => $request->medico,
'Centromedico_ID' => 1,
'fecha'=>$fecha,
'hora'=>$hora,
'nro'=>1,
'turno'=>'morning',
'estado'=>'waiting'
]);
This is my query... I need to know if the query was made in order to then perform a update
from another table.
I'm working with Laravel's QueryBuilder, I'm not using Eloquent
I'm using Carbon to manipulate dates on my platform, and I have no idea how to solve this.
public function theTurnIs($tipe){
$fecha_actual = $this->getTodayDate('notFormat');
$parse_date = Carbon::parse($fecha_actual);
$hora = $parse_date->hour;
if ($tipe == "hospital") {
if($hora > 19 || $hora < 7){
return "morning";
}elseif ($hora > 13 || $hora < 18) {
return "late";
}
}
}
The problem I have is that I need to compare hours and a half, but Carbon::parse
it only returns the hour or the minute... and what I need is to compare something
if($hora > '19:30' || $hora < '07:30'){
return "morning";
}
and that the variable $hora
has an hour with minutes... to be able to compare them... any ideas?
Well, I have a problem... I'm using sweetalert.js
and I've been racking my brain to understand how theconfirm
swal("Are you sure?", {
dangerMode: true,
buttons: true,
});
I have a button delete
and what I want is that it first ask if you want to delete the record or not, and depending on which button you select, it does so or not. But I do not know how to do it. I read the documentation but it doesn't explain it.
They sweetalert2
have a more intuitive confirm function...
Swal.fire({
title: 'Do you want to save the changes?',
showDenyButton: true,
showCancelButton: true,
confirmButtonText: 'Save',
denyButtonText: `Don't save`,
}).then((result) => {
/* Read more about isConfirmed, isDenied below */
if (result.isConfirmed) {
(AQUI IRIA MI FUNCION ELIMINAR)
} else if (result.isDenied) {
(AQUI UNA ALERTA "TU REGISTRO ESTA A SALVO")
}
})
But I don't know how to do that with the sweetalert.js
help
I have a problem. I have a table full of data and each record in this table has 2 buttons, show y delete
. These buttons have to trigger a JS function that will make a request to the server. My problem is that I don't want to put onclick="show($paciente->id)"
in each record, since I don't think it's a good practice, but I have no idea how to know which button is being pressed, since they will all trigger the same function but send a id
different .
@foreach ($pacientes as $paciente)
<tr>
<th scope="row">{{ $paciente->id}}</th>
<td>{{ $paciente->nombre }}</td>
<td>{{ $paciente->apellidos }}</td>
<td>{{ $paciente->carnet }}</td>
<td>{{ $paciente->fecha_nacimiento }}</td>
<td>{{ $paciente->telefono }}</td>
<td>{{ $paciente->direccion }}</td>
<td>{{ $paciente->strikes }}</td>
<td><a href="#" id="showUser" onclick="showUser({{ $paciente->ID}})" class="showUser" ><i class="far fa-eye"></i> Ver</a></td>
<td><a href="#" id="deleteUser" class="deleteUser"><i class="far fa-trash"></i> Eliminar</a></td>
</tr>
@endforeach
I tried with JS something like that, but it didn't work.
let showButton = document.querySelector('.showUser');
// let deleteButton = document.getElementById('deleteUser');
showButton.forEach((element) => {
element.addEventListener('click', function(){
alert(element.value);
})
})
Well, I ran into a problem.
I have inside a div padre
, two elements. One is a div
let 's call it hijo_1
and the other is a ul
that would be the hijo_2
.
The problem is that I am positioned in the node hijo 2
and what I want is to add hijo_1
a class called arrow
, but I have no idea how to do it.
Any ideas?
<li class="Padre" >
<div class="hijo_1">
<a href="#" class="nav__link open" ><i class="far fa-chart-pie"></i> Estadisticas</a>
<img src="{{ URL::asset('img/main/svg-icon/arrow.svg') }}" class="list__arrow">
</div>
<ul class="hijo_2">
<li class="list__inside">
<a href="#" class="nav__link nav__link--inside">Estoy dentro</a>
</li>
<li class="list__inside">
<a href="#" class="nav__link nav__link--inside">Estoy dentro</a>
</li>
</ul>
</li>
I am designing this menu and as you can see, there are buttons that have submenus, when you click the button with the menu icon (The 3 bars) the menu is hidden and only the menu icons are seen (The circles) But since it has sub menus, I try to make that when the menu is closed and they click on the element a
that would open a submenu, it also executes the function JS
that opens the entire menu to be able to visualize it. The problem is that when I give it addEventListener('click')
this it only works with the first sub menu. The others is as if the event was not assigned to them.
document.getElementById("open").addEventListener("click", open_menu);
function open_menu(){
body.classList.add("body_move");
side_menu.classList.add("menu__side_move");
}
This is the event and the function
<a href="#" class="nav__link" id="open"><i class="far fa-circle"></i> Servicios</a>
And this is the element. They all have the same id
but it only works with the first one, the others do not recognize the event, BUT, if I put the ´onclick=('open_menu()')´ directly there, it works. I could use the onclick and put it on each 'a' element that needs it, but it doesn't seem like a good practice and I also want to know why it only executes on the first one.
I'm making these cards on my page, and I have a problem with the styles that I can't solve. You see, I'm creating the cards inside a label this card has display:inline-block;
which should align them, and it does, the problem is that if the doctor's name creates a next line, it's like the next one goes down so that the text is at the same level . I don't know why this happens.
HTML
<div class="tarjeta-especialidad">
<img src="{{ URL::asset("img/png/user-icon.png") }}" style="min-width: 100px; min-height:100px" alt="">
<p>Fichas: 7 </p>
<p>Dr. {{ $Medico->nombre ." ". $Medico->apellidos}}</p>
</div>
CSS
.container-cards a{
text-decoration: none;
color: white;
display: inline-block;
}
.tarjeta-especialidad{
width: 130px;
height: 250px;
background: #97d1da;
margin: 5px;
text-align: center;
color: white;
border-radius: 5px;
padding: 5px;
color:#363B3E;
}
.tarjeta-especialidad img{
width: 100px;
margin: 10px;
color:#13ac4d;
border-radius: 100%;
}
I have a problem with my Json, you see, I query the database to check if a Patient has any referral or not. If you have it, you must return the patient data and also the referral data. And, if, on the contrary, it does not have a referral, it will only return my patient's data. This returns it to me as a Json.
What I want to do is check if that Json has a field called, for example, nameDoctor , because if it does, it will show a different data card, which will obviously include the derivation data.
let patientData = JSON.parse(this.responseText);
if(isset(patientData.nameDoctor)){
alert('Si tiene Medico');
}else{
alert('No tiene Medico');
}
Something like that. Obviously the isset is from PHP, what I want is to translate that to JS
Well, I have the following problem, I really hope you can help me.
I'm doing a query with Laravel's queryBuilder, the problem is that I have fields from different tables (Patient and Doctor) with the same attribute name and the data overlaps and I don't know what to do.
This is the query
$MisPacientesHoy = DB::table('fichamedica')
->join('Medicos','fichamedica.Medico_ID','=','Medicos.ID')
->join('Pacientes','fichamedica.Paciente_ID','=','Pacientes.ID')
->select('Pacientes.ID','Pacientes.nombre','Pacientes.apellidos','Pacientes.carnet','Pacientes.fechanacimiento','Pacientes.telefono','fichamedica.estado')
->where('fichamedica.Medico_ID', '=',$Medico_ID)
->where('fichamedica.fecha','=',$fecha_actual)
->where('fichamedica.turno','=',$Turno)
->orderBy('fichamedica.NroFicha', 'asc')
->get();
The problem is that I need this query to also return my doctor's data such as name, surname, and ID, but since the patient already has the property or attribute called 'name' when doing it @foreach
in my view, the data they will overlap
@foreach ($MisPacientesHoy as $Paciente )
<div>{{ $Paciente->nombre." ".$Paciente->apellidos." ".$Paciente->Medicos->nombre }}</div>
As I said, the query is fine, but I don't know how to return data from different tables with the same attribute in the same query.
I'm using Laravel and I want to delete a record, for this I'm using an XMLHttpRequest, the problem is that, since I'm using the routes through 'Resource' (Route::resource('/url',Controller::Class);)
Well, to access the 'Destroy' method, it asks me to send the parameters with the DELETE method from the view, and I don't know how to do it with the XMLHttpRequest requests, remembering Ajax, I tried to do this, but it didn't work
const http = new XMLHttpRequest();
const url = "/Medicos/" + id ;
const type = 'DELETE';
http.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
let Medico = this.responseText;
console.log(Medico);
}
};
http.open("GET", url);
http.send();
Also try changing the
http.open('DELETE', url);
But it throws me this error
DELETE http://moon.project/Medicos/2 419 (unknown status)
I'm going crazy, I haven't worked with Json files in a long time and I practically forgot how to do it.
From Laravel I am doing a query, and I want to return this query as a JSON .
public function edit($id){
$Medico = Medicos::all()->where('ID',$id)->toJson();
return Response()->json($Medico);
}
I am making the request with an httpRequest from Javascript :
function cargarModal(){
const http = new XMLHttpRequest();
const url = "/Medicos/1/edit";
http.onreadystatechange = function(){
if (this.readyState==4 && this.status == 200) {
let Medico = this.responseText;
console.log(Medico);
}
}
http.open('GET', url);
http.send();
}
In the console it returns a Json , but strange...
"[{\"ID\":1,\"centromedico_id\":1,\"user_id\":1,\"especialidad_id\":1,\"nombre\":\"Pepito\",\"apellidos\":\"Perez\",\"carnet\":1037,\"fechanacimiento\":\"199-02-30\",\"telefono\":75875,\"fichas\":10,\"created_at\":null,\"updated_at\":null}]"
I say weird , because I don't remember that a Json has backslashes.
The problem is that I don't know how to print the data, that is, I don't know how to print the name, surname, ID and so on... I was looking for information, but nothing works for me, I don't know what I'm doing wrong. Please help.